Vue: 区分单向数据流和双向绑定

[leslie1943]

Vue: 区分单向数据流和双向绑定

• 单向数据流指只能从一个方向修改数据, 姑且我们可以这样理解, 一个父组件下有两个子组件1和子组件2, 父组件可以向子组件传递数据. 假如子组件都获取到了父组件的name, 在子组件1中对name重新修改之后, 子组件2和父组件中的值并不会发生改变, 这正是因为Vue中的机制是单向数据流, 子组件不能直接改变父组件的状态. 但反过来, 如果是父组件中的name修改了, 当然两个子组件中的name也就改变

• Vue.js一直都是单向数据流, 不要和双向绑定搞混(双向绑定指的是页面View与数据Model的响应式)

• 但是在实际应用过程中, 经常会出现子组件直接修改父组件传递的props的情况

• 1. 传递 Object对象: 父组件传递Object对象到子组件, 子组件可修改父组件传递的Object对象的属性, 在父组件内可接收到改变的属性
• 2. 使用官方推荐的.sync,在子组件中this.$emit(update:propName,newValue): 这事一种事件冒泡的形式去更新数据的