14. VUE 子组件修改父组件的值

在 Vue 当中，父组件 -> 子组件 传值，都是通过属性的形式传递的。

子组件 修改 传递数据

直接操作父组件传递过来的值，用是可以用的，但是打开控制台后，会发现 Vue 有个警告：你不要直接修改父组件传递过来数据。

单向数据流的概念

在 Vue 当中有个单向数据流的概念，也就是父组件可以向子组件通过属性的形式传递参数，你传递的参数可以随便修改，也就是说父组件可以随意的向子组件随意的传递参数，但是子组件绝对不能反过来去修改父组件传递过来的参数。

之所有 Vue 之中有单项数据流的概念，原因在于，一旦你的子组件接受的数据不是基础类型时，例如对象，也就是引用类型的数据时，你在子组件里面改变了传递过来的数据，有可能这个数据还被其他子组件使用，这样你这个子组件改了这个数据，不仅仅影响你你这个组件，还可能对其他的子组件造成影响。

在vue2.0+ 后不再是双向绑定,如果要进行双向绑定需要特殊处理。

[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data 
or computed property based on the prop's value. Prop being mutated: "你修改的属性名"

 

 

参考：https://www.jb51.net/article/142021.htm