Vue面试总结

127 阅读1分钟

MVVM是什么?对比MVC优势?

MVVM即model、view、viewmodel缩写,model和view分别代表的是数据和业务逻辑层、视图层,viewmodel是桥梁,连接view和model,包括dom-listener和data-binding,实现双向数据绑定。

特点:

  1. MVC是数据单向绑定。
  2. MVVM低耦合,实现页面逻辑和渲染的解耦,视图和数据的解耦,实现组件化开发。

双向数据绑定的原理

  • 数据劫持(Object.defineProperty)和发布订阅者模式

v-model

语法糖,通过v-bind绑定数据和v-on触发oninput事件实现v-model

<input
  v-bind:value="searchText"
  v-on:input="searchText = $event.target.value"
>
<!--
自html5开始,input每次输入都会触发oninput事件,
所以输入时input的内容会绑定到searchText中,于是searchText的值就被改变;
$event 指代当前触发的事件对象;
$event.target 指代当前触发的事件对象的dom;
$event.target.value 就是当前dom的value值;
在@input方法中,value => searchText;
在:value中,searchText => value;
-->