美文网首页
Vue真的实现了双向数据绑定吗?

Vue真的实现了双向数据绑定吗?

作者: FTD止水 | 来源:发表于2019-04-08 22:41 被阅读0次

    前端技术面试的时候,当问道有关Vue技术问题的时候,“什么是MVC?什么是双向数据绑定?”,这种问题几乎是必问的。MVC非常好回答,给出如下解释:

    M:Model 模型——数据层
    V:View 视图——表现层
    C:Controller 控制器——业务逻辑层
    实现各层之间的完全分离,MVC只是手段,目的是实现代码的复用。

    双向数据绑定相信绝大多人数都会这样回答:

    简单来说数据既可以流入,也可以流出。视图层的改变会影响数据层的改变,数据层的改变也会相应的改变视图层。

    其实Vue是单向数据流,并没有实现双向数据绑定。我们知道,要想实现双向绑定的效果,就要在表单元素中加入v-model="xxx"指令,这样视图层的改变相应的数据层才会改变。v-model是vue给我们提供的内置指令,而内置指令的作用就是用来操作DOM,它其实是封装了处理DOM的逻辑,从而简化了我们的代码,v-model的作用就是用来监听我们的视图层数据是否发生了改变,如果改变了,就把相应的数据层数据也进行改变,这种v-model内置指令的功能完全可以通过vue的自定义指令来手动实现,只不过作者已经为我们封装好了,方便我们频繁的使用v-model指令。如果我们没有在表单元素中加入v-model指令,视图层的改变并不能影响数据层,反过来数据层的改变确可以影响到试图层,这是因为MVC中的C端替我们更新了DOM中的数据,这个C端的控制器也只是实现了数据层数据流入视图层的功能,也就是所谓的单向数据流,而v-model仅作为一个语法糖指令,替我们实现了数据从视图流入数据层的效果。
    综上,vue的控制器只实现了单向数据流。如果非要说vue实现了双向数据绑定,那我们也可以用JQ模拟双向数据流,难道我们能说JQ也实现了双向数据绑定吗?

    止水
    于沈阳
    2019/04/08 22:41

    相关文章

      网友评论

          本文标题:Vue真的实现了双向数据绑定吗?

          本文链接:https://www.haomeiwen.com/subject/gwymiqtx.html