vue父子组件之间的通信

利用props在子组件接受父组件传过来的值
1.父组件parentComp.vue

<template>
　　<childComp :fromParentToChild="fromParentToChild"></childComp>
</template>
<script>
import childComp from './childComp.vue'
export default{
　　data(){
　　return{
　　fromParentToChild:"I am from Parent"
　　}
  },
　　components:{childComp}
  }
</script>

 

2.子组件childComp.vue

<template>
<div>{{fromParentToChild}}</div>
</template>
<script>
export default{
props:['fromParentToChild'],
data(){
console.log(this.fromParentToChild)
return{
  }
  }
  }
</script>

 

3.路由文件index.js

export default new Router({
routes: [
{
path:'/parentToChild',
name:'parentToChild',
component:require('../components/demo/parentComp.vue')
}})

 

在浏览器地址栏输入：http://localhost:[port]/#/parentToChild
可以在页面窗口看到显示：I am from Parent