1回答

阿莱克斯刘

2021-06-25

是的，找不到这种场景是正常的，因为数据双向绑定的思维已经过时了，早期的angularjs（1.x时代，2005年以前）使用的就是这种架构。但是，双向数据流本身就不太科学，angularjs时不时会陷入无限数据循环或数据脏读的过程中，于是几乎所有的框架都放弃了双向数据流的设计。

用input框举个例子吧：

1. 双向绑定：我们有个input框，数据绑定在state.input上，初始化state.input设置为“hello”，于是我们的html页面的input就会显示“hello”；这个时候，用户向input输入“world”，于是首先input框自己把内容（value）改为world，然后再把world推给state.input，从而改变数据内容。

2. 单向绑定：还是同样的input框，数据依然绑定在state.input上，初始化state.input还是设置为“hello”，于是我们的html页面的input同样还是会显示“hello”；但不一样的是，当用户向input输入“world”的时候，input的内容（value）是暂时不会改变的，而是首先会启动input的监听 onchange()，我们需要在onchange监听中根据用户输入来更新state.input的数据；最后，当state.input发生变化以后，会触发重新渲染input的ui，于是input框的hello就改变为world了。

单向流动的思路会稍微复杂一点，工作也会稍微多一些。但是他的渲染逻辑非常清新，有且只有state变化，才会触发ui重新渲染。从而避免了数据的无限循环、避免了脏读、避免了系统过度开销等问题，不管是性能、调试、还是代码逻辑都又了很大程度的提升。

1

2

阿莱克斯刘

回复

慕莱坞0998854

你的理解没有错，对于vue、react 、angular（2以上）input的value数据改变永远都是从state流向ui的。这里面并没有冗余产生，只不过是赋值和ui渲染过程有点绕而已。

2021-06-25

共2条回复