vue2实现组件的双向绑定（组件props的双向绑定）

组件的prop双向绑定于vue2废除，vue2的prop只限于父->子的单向流动，不能修改外层传来的数据，如果需要得自己来实现。

实现方法步骤： 

　　1.在组件内得data对象中创建一个props属性的副本

 data: function () {
 return {
 myResult: this.result（props中得值）//data中新增字段
 };

　　2.创建针对props属性得watch来同步组件外对props的修改，加入外部修改props，不会同步到副本。

 watch: {
 result(val) {//props的值
 this.myResult = val;//新增result的watch，监听变更并同步到myResult上
 }

　　3.创建针对props副本的watch，通知到组件外。此时在组件内修改props的副本，组件外并不知道，所以还需要监听副本——>通知外层

 watch: {
 result(val) {
 this.myResult = val;//②监听外部对props属性result的变更，并同步到组件内的data属性myResult中
 },
 myResult(val){
 //xxcanghai 小小沧海 博客园
 this.$emit("on-result-change",val);//③组件内对myResult变更后向外部发送事件通知
 }
 },

什么样的props适合做双向绑定？

首先要声明的是双向绑定的props肯定是不利于组件间的数据状态管理，尤其是在复杂的业务中更是如此，所以要尽可能的少用双向绑定，过于复杂的数据处理建议使用Vuex （http://vuex.vuejs.org/zh-cn/intro.html）

但是在我们平时使用过程中又确实有props双向绑定的需求，个人认为只有在满足以下条件时再使用双向绑定的props。

• 组件内部需要修改props。
• 组件需要可以由外部在运行时动态控制，而非单纯初始化。
• 组件外部需要读取组件内的状态来进行处理

有组件可以简化此过程，资料来自https://www.jb51.net/article/98881.htm