Vue | router-view传值_vue router-view传值

router-view传值也是父子组件传值

父组件中：

     <div>
      <v-top></v-top>
      <router-view :data1="data1"></router-view>
    </div>
 
     data(){
        return {
          data1:'init',
        }
      },
 
     created(){
        this.data1 = 'change in created()'
      },
      mounted() {
        this.data1 = 'change in mounted()';
      }

子组件中：

props: ['data1']
 
mounted(){
    console.log(this.data1);
}

结果

原因是当父组件mounted函数运行前，页面dom已经完成了加载，即子组件已经加载好，数据也已经传过去了。

而created阶段，可以给数据赋值，但还没有加载dom，因此可以在这一阶段给数据赋值，等待dom加载。