vue的单向数据流以及语法糖.sync

vue支持双向数据流吗？
除了最开始angularJs支持数据的双向流动之外，vue和react是均不支持的。vue之所以被常说双向数据流，其实是错误的。是因为它是双向绑定被有些人理解为双向数据流。

vue的单向数据流是指：父组件中的数据可以通过props流动到子组件中，并且当父组件中的数据发生改变的时候，子组件会自动接收到这个修改后的数据，并且更新页面中的内容。

props是只读的，如果修改props里的值会报错。

但是vue检测props只能检测基本类型的值，而对于复合类型（即对象），只能检测引用地址有没有变化，而属性值变化，不会被检测到。

 

利用.sync来支持双向数据流

vue2提供一个.sync修饰符来实现‘双向数据流。

具体见’https://cn.vuejs.org/v2/guide/components-custom-events.html#sync-%E4%BF%AE%E9%A5%B0%E7%AC%A6

// 父组件

	<Son :msg.sync="message"></Son>
    ...
    data() {
		return {
			message: "标题",
		}
	}

//子组件
    <span>{{ msg }}</span>
    <button @click = 'change'></button>
    ...
    methods: {
		change() {
			this.$emit("update:msg", "标题改变了!")
		}
    }