vue面试题（待更新）
什么是MVVM
MVVM即Model-View-ViewModel的简写。即模型-视图-视图模型。模型（Model）指的是后端传递的数据。视图(View)指的是所看到的页面。视图模型(ViewModel)是mvvm模式的核心，它是连接view和model的桥梁。
数据双向绑定原理--Object.defineProperty()
视图模型(ViewModel)有两个方向：一是将模型（Model）转化成视图(View)，即将后端传递的数据转化成所看到的页面。实现的方式是：数据绑定。二是将视图(View)转化成模型(Model)，即将所看到的页面转化成后端的数据。实现的方式是：DOM 事件监听。这两个方向都实现的，我们称之为数据的双向绑定。
v-if和v-show的区别
- v-if是直接新增删除DOM节点，v-show是切换标签的display样式;
- v-if 有配套的 v-else-if 和 v-else，而 v-show 没有
- v-if 可以搭配 template 使用，而 v-show 不行
- v-show只编译一次，而v-if不停的销毁和创建
v-if和v-for为什么不建议一起使用
- v-if 指令用于条件性地渲染一块内容,这块内容只会在指令的表达式返回 true值的时候被渲染
v-for 指令基于一个数组来渲染一个列表。v-for 指令需要使用 item in items 形式的特殊语法，其中 items 是源数据数组或者对象，而 item 则是被迭代的数组元素的别名 - 两者作用在同一个元素时,优先级是不同的。 在vue2中,v-for的优先级更高 。在vue3中,v-if的优先级更高。
- 把 v-if 和 v-for 同时用在同一个元素上，带来性能方面的浪费（每次渲染都会先循环再进行条件判断）
v-for的key值为什么不建议使用索引
当 Vue 正在更新使用v-for 渲染的元素列表时，它默认使用“就地更新”的策略。如果数据项的顺序被改变，Vue 将不会移动 DOM 元素来匹配数据项的顺序，而是就地更新每个元素，并且确保它们在每个索引位置正确渲染。如果没有唯一的key值，就是递归逐一按照顺序进行比较先后的节点,key 一定要是唯一标识。
生命周期
| beforeCreate | 在实例初始化之后，数据观测和事件配置之前被调用 此时data 和 methods 以及页面的DOM结构都没有初始化 什么都做不了 |
|---|---|
| created | 在实例创建完成后被立即调用此时data 和 methods已经可以使用 但是页面还没有渲染出来 |
| beforeMount | 在挂载开始之前被调用 此时页面上还看不到真实数据 只是一个模板页面而已 |
| mounted | el被新创建的vm.$el替换，并挂载到实例上去之后调用该钩子。 数据已经真实渲染到页面上 在这个钩子函数里面我们可以使用一些第三方的插件 |
| beforeUpdate | 数据更新时调用，发生在虚拟DOM打补丁之前。 页面上数据还是旧的 |
| updated | 由于数据更改导致的虚拟DOM重新渲染和打补丁，在这之后会调用该钩子。 页面上数据已经替换成最新的 |
| beforeDestroy | 实例销毁之前调用 |
| destroyed | 实例销毁后调用 |
vue组建通信方式有哪些
- 通过 props 传递
- 通过 $emit 触发自定义事件
- 使用 ref
- EventBus
- $$parent 或$root
- attrs 与 listeners
- Provide 与 Inject
- Vuex
keep-alive
- keep-alive是vue中的内置组件，能在组件切换过程中将状态保留在内存中，防止重复渲染DOM
- keep-alive 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们
- keep-alive可以设置以下props属性：
include - 字符串或正则表达式。只有名称匹配的组件会被缓存
exclude - 字符串或正则表达式。任何名称匹配的组件都不会被缓存
max - 数字。最多可以缓存多少组件实例 - 在某些场景下不需要让页面重新加载时我们可以使用
keep-alive
