20道vue前端面试题总结

原创

已于 2022-10-07 16:07:17 修改 · 2.4k 阅读

14 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #面试

于 2021-10-03 23:47:35 首次发布

本文总结了20道关于Vue.js前端面试的关键问题，涵盖双向绑定、v-model原理、MVC与MVVM区别、计算属性、生命周期、动画控制、组件通信等核心知识点，深入探讨Vue框架的特性和应用场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

双向绑定是什么意思？

双向是指ViewModel中的data部分和View之间的双向关系。
正向：数据驱动页面
反向：页面更新数据
绑定是指自动化处理，data改变了view随之改变，反之也是。
不用像传统方式那样，通过onChange事件获取用户输入，然后再通过改变innerHtml修改显示。

说一下v-model的原理

v-model本质就是一个语法糖，可以看成是value + input方法的语法糖。
可以通过model属性的prop和event属性来进行自定义。原生的v-model，会根据标签的不同生成不同的事件和属性。

MVC与MVVM的区别

MVC是后端的分层开发概念，MVVM是前端视图层的概念，主要关注与视图层分离，也就是把前端视图层分成了三部分Model、view、VMViewModel；
MVC中M是model层：负责操纵数据库。V是view层：视图层，发送请求，接收响应。C是controller，是业务逻辑处理层，接收请求和返回响应。
MVVM中M为model层：数据层保存数据，V是view层是页面的HTML结构。VM是一个调度者，链接M与V
什么是双向数据绑定
Vue.js 是一个 MVVM 框架，即数据双向绑定，即当数据发生变化的时候，视图也就发生变化，当视图发生变化的时候，数据也会跟着同步变化。这也算是 Vue.js 的精髓之处了。
值得注意的是，我们所说的数据双向绑定，一定是对于 UI 控件来说的，非 UI 控件不会涉及到数据双向绑定。单向数据绑定是使用状态管理工具的前提。如果我们使用 vuex，那么数据流也是单项的，这时就会和双向数据绑定有冲突。