[Vuejs]-How do I use a computed property in a child Vue component using vue-router

by

0👍

You don’t need to use a computed method with static data (or with data that, once the component is created, will never change. You could simply use the data property of the component.

Then: what are you tryng to do? Maybe you need a menu component? You can declare your App (or main component)’s template in this way:

<template>
  <div id="app">
    <custom-menu></custom-menu>
    <router-view></router-view>
  </div>
</template>

In your custom-menu component you can handle your menu links, if they change based on the route

👤radar155

0👍

I’m still not sure how to pass an dynamic object through as a prop but I think I was overthinking the whole thing.

From the vue.js documentation: “It is often overlooked that the source of truth in Vue applications is the raw data object”

Since I was only trying to get an authorization state passed down globally to my components it was simplest to just reference the root data instance.

So in any component that I need that data I just create a computed property:

computed: {
    user(){
      return this.$root.$data.user
    }
  }

In cases where the root data is dynamic or their are lots of global data vuex works great. I just didn’t want to use it for this small project.

👤Doug E

Leave a comment