vue组件间传值

父传子

1.父组件：在子组件容器内绑定数据

<router-view :unusedOrderNum="num1" :usedOrderNum="num2" :unreadMsgNum="num3" :evaluateNum="num4">

</router-view>

　　data中定义变量：

　　data() {

　　　　return {

　　num1: 2, //未使用订单数量

　　num2: 66, //已使用订单数量

　　num3: 33, //未读消息数量

　　num4: 77 //评价数量

　　　　};

　　},

 

2.子组件：用props接收父组件传过来的数据

 

export default {

props:["num1","num2","num3","num4"],

components: {

},

　　渲染数据：

<span class="">{{num1}}</span>

<span class="">{{num2}}</span>

<span class="">{{num3}}</span>

<span class="">{{num4}}</span>

 

 

===>>>未完待续。。。。