[随笔] vue相关题目

记录一些个人遇到的，觉得有必要了解或是记忆或是掌握vue相关知识点。
立个flag，每日刷…
p：个人理解
k：参考答案
————————————

1. 谈谈你对 MVVM 的理解。
   p: MVVM是一种架构模式，是一种思想：其中M就是 model，是数据模型，可以理解成是数据层，用来存储所需数据模型；V就是 view，是用户操作页面，可以理解成视图层，VM (数据驱动View Model)是 MVVM的核心，可以理解成是业务逻辑层，它提供了数据的双向绑定，是M(model) 与 V(view) 之间的调度者，做中间处理，当model中的数据发生变化后，会通过 VM 处理后在 view 中渲染出来 。
   ——————11/23
   k：p基本正确；补充—>删除部分修改为：“当用户操作View，ViewModel感知到变化，然后会通知Model发生相应改变，反之亦然。”ViewModel向上与视图层View进行双向数据绑定，向下与Model通过接口请求进行数据交互，起到承上启下的作用。MVVM本质就是基于操作数据来操作视图进而操作DOM，借助于MVVM无需直接操作DOM，开发者只需完成包含声明绑定的视图模板，编写ViewModel中有的业务，使得View完全实现自动化。
   实现原理等更多详细 —> 简书

2. vue开发中常用的指令有哪些？
   p: v-model, v-bind(" : “), v-html, v-if 和 v-show, v-on(”@"), v-for等
   ——————11-24
   k：vue常用的几个指令: v-text, v-html, v-bind, v-on， v-model， v-for
   简析：
   v-text — <h1 v-text="msg"></h1>
    解释：更新DOM对象的 textContent，类似于 vue 插值表达式：{{}}
   v-html — <h1 v-html="msg"></h1>
    解释：更新DOM对象的 innerHTML，文本会作为 HTML 代码解析后展示(会渲染其中设定样式)
   v-bind — v-bind:title="msg"// 简写：:title="msg"
    作用：当表达式的值改变时，将其产生的连带影响，响应式地作用于 DOM
   v-on — v-on:click="say" or v-on:click="say('参数', $event)" //简写：@click="say"
    作用：绑定事件，事件定义在methods 内
   v-model — <input type="text" v-model="message" placeholder="edit me">
    作用：在表单元素上创建双向数据绑定
    说明：监听用户的输入事件以更新数据
    案例：计算器
   v-for — <p v-for="(item, index) in list" :key="index">{{item}} -- {{index}}</p>
    作用：基于源数据多次渲染元素或模板块
   详细可参见 —> 简书-Real_man

3. 请详细说说你对 vue 生命周期的理解。
   k：vue生命周期是每个 Vue 实例在被创建之前都要经过一系列的初始化过程。总共可以分为8个阶段：创建前/创建后，挂载前/挂载后，更新前/更新后，销毁前/销毁后，每个阶段均有对应一个钩子函数：(11-25)
    创建期间钩子函数：
   beforeCreated：实例刚刚开始被创建，元素 DOM 、 data 和 methods 都还未初始化好，暂无此生命周期相关操作。
   created：实例创建完成，此时数据 data 已经初始化完成，方法也已经可以调用，但是 DOM 未渲染(模板编译未完成)。在这个周期里面以操作样式，如果进行请求是可以改变数据并渲染，但由于DOM未挂载，请求过多或者占用时间过长会导致页面线上空白。
   beforeMount：已完成模板编译，但仍未挂载到页面中，数据也仍未渲染到页面中。
   mounted：数据和DOM都完成挂载，在上一个周期占位的数据把值给渲染进去。一般请求会放在这个地方，因为这边请求改变数据之后刚好能渲染。
    运行期间钩子函数：
   beforeUpdate：只要是页面数据改变了都会触发，数据更新之前，此时 data 中的数据是最新的，但页面数据还是原来的数据(未渲染)，当你请求赋值一个数据的时候会执行这个周期，如果没有数据改变不执行。
   updated：只要是页面数据改变了都会触发，实例数据更新完毕，页面数据也更新完毕；updated要谨慎使用，因为页面更新数据的时候都会触发，在这里操作数据很影响性能和容易死循环。
    销毁期间钩子函数：
   beforeDestroy：实例销毁前调用，在这个周期里面还可以使用data和methods。
   destroyed：实例销毁后调用，vue 实例的所有东西接除绑定，此时组件中的方法、数据、过滤器、自定义指令等均不可用了，子实例也同时销毁。常用来销毁一些监听事件及定时函数。
   官方图示说明 —> vue生命周期

4. item