v-if 和 v-show的区别

v-if是控制真正的渲染或销毁，而不是显示与隐藏
v-show通过css display来控制显示与隐藏
频繁的切换显示状态用v-show，否则使用v-if

为何v-for中要用key

diff算法中通过tag和key来判断是否是sameNode
updateChildren中有了key，可以减少渲染次数，提升渲染性能。可以尽可能复用vnode
key，不能是index和random，一般都是以id作为key

描述 vue组件生命周期（以及有父子组件，两者的生命周期）

1）单个组件的生命周期
    - 组件的生命周期分为四个阶段
        create(创建)
        mount（挂载）
        update(更新)
        destroy(销毁)
    - 生命周期钩子函数
        1.钩子函数定义
        官方解释
            每个Vue实列在被创建时都要经过一系列的初始化过程----例如，需要设置数据监听、编译模板、将实列挂载到DOM并在数据变化时更新DOM等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在 不同阶段添加自己的代码的机会
        钩子函数到底是啥意思？
            组件在加载的过程中，加载到某个阶段时，自动触发的函数

2）父子组件的生命周期父beforeCreate -> 父created -> 父beforeMount -> 子beforeCreate -> 子created -> 子beforeMount -> 子mounted -> 父mounted -> 父beforeUpdate -> 子beforeUpdat -> 子updated -> 父updated -> 父beforeDestroy -> 子beforeDestroy -> 子destroyed -> 父destroyed

组件间如何通讯

[vue组件间的九种通信方式 - 掘金 (juejin.cn)](https://juejin.cn/post/7002416653287833613)

九大组件通信方案 juejin.cn/post/700241…

组件初次渲染和更新的过程

初次渲染:
- 第一步：解析模板为render函数
- 第二步：触发响应式，监听data中的属性，getter和setter
- 第三步：执行render函数，生成vnode，进而进行patch(elem, vnode)
  - 这一步会触发data getter，在getter中进行依赖收集（把数据“观察”起来）
  - 注意：不一定是所有的数据都会被观察。是否被观察取决于模板是否使用
- 第四步：把vode转化成真的DOM，渲染到页面上
更新过程：
- 第一步：修改数据，会触发data setter
- 第二步：重建执行render函数，生成新的vnode（newVnode）
- 第三步：进行patch（vnode, newVnode）, patch的过程就是diff的过程

双向数据绑定v-modle的原理

v-bind绑定value属性的值
v-on绑定input事件监听到函数中，函数会获取最新的值赋值到绑定的属性中

<input v-model="searchText"/>

等价于：

<input :value="searchText" @input="searchText = $event.target.value"/>

vue2 和 vue3 的区别 (juejin.cn/post/702577…)

说一下对MVVM的理解

MVVM是Model，View， ViewModel的缩写。MVVM是一种设计模式。Model是数据层，用于存储数据和对数据进行增删改查。View是视图层，也就是UI界面，用于将数据模型转化成UI展现出来，ViewModel是一个同步View和Model的对象
在MVVM架构下，View和Model没有直接联系，而是通过ViewModel进行交互，Model和View之间的交互是双向的，因此View把变化同步到Model中，而Model数据的变化也反应到View上
ViewModel通过双向数据绑定把View层和Model层连接起来，而View和Model之间的同步工作完全是自动的，无需人为干涉，因此开发者只需关注业务逻辑，不需要手动操作DOM，不需要关注数据状态的同步问题，复杂的数据状态维护完全由MVVM来统一管理

computed 和 method 的区别

(blog.csdn.net/qq_36179366…)

前端经典面试题