如何在不使用事件总线的情况下获取另一个组件中组件中数据属性的值？

Question

我有一个数据属性'auth'，它保存用户是否登录。如果它是空的，那么用户没有登录，如果它已“登录”，则用户登录。

这是一个名为'App.vue'的组件，我有另一个名为'DashboardComponent.vue'的组件。如果用户未经过身份验证，但在“/ dashboard”URL中输入，我希望应用程序将用户踢回登录屏幕。如何从'App.vue'组件中获取'auth'数据到'DashboardComponent.vue'并检查用户是否经过身份验证（在仪表板呈现之前）？

编辑：

这就是我目前正在努力做到的

[DashboardComponent]
EventBus.$on('logged-in', status => {
  this.auth = status
})

beforeMount () {
    if (this.auth !== 'loggedin') {
      router.push({name: 'login'})
    }
}

这是正确的方法吗？如果是这样，为什么它不起作用？

Answer 1

将您的数据声明为主文件，其中vue初始化为

window.App = new Vue({
  el: '#app',
  router,
  components: { App },
  data: function(){
        return {
          auth:''
        }
   }

})

之后你可以在主文件中将其更改为

mounted:function(){
  //when logged in then change status
  this.status = 'loggedIn'
}

现在使用App.status在任何组件中访问它