Question

我是Vue的新手，我遇到了无法进入的问题。我有两个文件。

第一个是App.vue，其中定义了<router-view>

<script>

export default {
  name: 'app',
  data(){
    return{
      info: false,
    }
  },
  beforeMount(){
        example...
        this.info= true
        this.$router.push('/main'); //where in router-view visible is component Main.vue

      }
  }

</script>

第二个是明确的组件Main.vue：

<script>
export default{
    name: 'main',
    data(){
        return{

        }
    },
    beforeMount(){
        //what i want to do:
        console.log(App.data().info) //here should be visible true in console log
    } 
}

我想在第二个文件中访问第一个文件中的属性。怎么做得好？先感谢您

Answer 1

每个组件实例都有自己独立的范围。如上所述：https://vuejs.org/v2/guide/components.html#Passing-Data-with-Props

您不能（也不应该）直接引用子组件模板中的父数据。可以使用props将数据传递给子组件。

Answer 2

我能想到的两个选项：

将道具传递给路线组件

来源：link

在您的路由器中：

import main from './main.vue'

    const router = new VueRouter({
      routes: [
        { path: '/main/:id', component: main }
      ]
    })

在您的Main.vue

访问变量：this。$ route.params.id

将数据保存在状态管理器中，并通过另一个组件Vuex

Vue2.0无法访问的变量

2 个答案: