单和双向绑定使用场景

问题提出

https://www.zhihu.com/question/49964363html

vue或者angular的介绍里说本身的特点是双向数据绑定,而在看react的介绍中,说本身的优点和特点是单向数据绑定。vue

 

vue 和 angularjs支持双向绑定, 可是单向绑定是基本功能, 与react同基础。react

那么什么状况下,使用单向绑定, 什么状况下使用双向绑定呢?angularjs

 

概念

https://www.cnblogs.com/Breaveleon/p/6680175.htmlredux

单向数据绑定:指的是咱们先把模板写好,而后把模板和数据(数据可能来自后台)整合到一块儿造成HTML代码,而后把这段HTML代码插入到文档流里面。框架

单向数据绑定缺点:HTML代码一旦生成完之后,就没有办法再变了,若是有新的数据来了,那就必须把以前的HTML代码去掉,再从新把新的数据和模板一块儿整合后插入到文档流中。mvvm

双向数据绑定:数据模型(Module)和视图(View)之间的双向绑定。spa

用户在视图上的修改会自动同步到数据模型中去,一样的,若是数据模型中的值发生了变化,也会马上同步到视图中去。双向绑定

 

选择考虑点

https://www.zhihu.com/question/49964363htm

一、单向绑定使得数据流也是单向的,对于复杂应用来讲这是实施统一的状态管理(如redux)的前提。

二、 双向绑定在一些须要实时反应用户输入的场合会很是方便(好比多级联动菜单)。

三、 全局性数据流使用单向,好跟踪。局部性数据流使用双向,简单。

四、若是你的程序须要一个统一的数据源, 应该选择单向数据流, 全部的数据变化都是可观测的, 数据自上而下流动, 即便出问题也很容易找到源头.

若是你的程序自己有多个数据源, 或者是程序的逻辑自己会产生不少的反作用, 应该选择双向绑定的程序, 将大项目分化为小项目, 逐个击破.

 

单向与双向联系

https://www.zhihu.com/question/49964363

再来看 flux 的这张图
若是咱们作进一步封装,把 action 跟 dispatcher 都隐藏在框架内部,最后图就变成这样了
若是再进一步,把相互手动通知的机制再隐藏起来,变成这样了
这个不就是 mvvm 里面的双向绑定么(手动尴尬)。。。
相关文章
相关标签/搜索