Vue中值的传递（父传子，子传父，子父同步）

1.父组件->子组件传递数据

①父组件通过 v-bind: 属性绑定的形式，把数据传递给子组件

如果不需要动态绑定，则可以直接写number=“张三”

②子组件中，通过props接收父组件传递过来的数据

 2.子组件->父组件传递数据

1.在子组件中：

• 在emits定义自定义事件
• 通过触发事件来触发自定义函数，并传递数据

 2.在父组件中：

 

 3.子组件和父组件同步数据

 

①在v-bind：指令之前添加v-model指令

②在子组件中声明emits自定义事件，格式为updata:xxx 

③调用$emit()触发自定义事件，更新父组件中的数据

App.vue

Counter.vue

个人总结：

1.父传子{

父：在组件中传递参数（：number=‘传递的参数’）

子：接收父组件传递来的数据（props:{ }）

}

2.子传父{

子：在emits定义自定义事件，通过触发事件来触发自定义函数，并传递数据

父：监听自定义事件，调用方法，该方法的形参就是传递过来的数据。（@change=(add) add(value){这里的value就是子传递过来的参数}）

}

3.父子同数据

思路：在父向子传递的基础上，再改写子向父传递