vue的单向数据流和双向数据绑定

单向数据流:指只能从一个方向修改数据

如下图:

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

 

                                                   vue的单向数据流和双向数据绑定

双向数据绑定:

主要是由MVVM框架实现,在Vue中主要由三个部分组成,View、ViewModel和Model组成,其中View和ViewModel不能直接进行通信,他们要通过中间件ViewModel来进行。例如,当Model部分数据发生改变时,由于vue中Data Binding将底层数据和Dom层进行了绑定,ViewModel通知View层更新视图;当在视图 View数据发生变化也会同步到Model中。View和Model之间的同步完全是自动的,不需要人手动的操作DOM。 如下图:

                            vue的单向数据流和双向数据绑定