标签：02 vue computed 修饰符 watch 面试 计算 属性

01. vue中 key 值的作用？

key的作用主要是为了高效的更新虚拟DOM,因为vue组件高度复用，增加Key可以标识组件的唯一性.

02. v-if 和 v-show 区别

• v-show 页面会正常渲染但是会用display:none给隐藏掉而v-if不会渲染。
• 一般如果是一次性的或者更新不是很频繁的时候会用v-if，这样不会把更多的东西暴露在浏览器中。
• 如果是很频繁的切换就用v-show来写，这样性能会好一些，而用v-if会频繁的进行dom的销毁和加载。

03. v-if 和 v-for是否可以一起使用？

不能。
v-for比v-if计算优先级高一些，在渲染模板的时候，会先用v-for进行循环，之后在用v-if进行判断，这样导致的结果就是执行多次重复循环，每一遍循环都要进行v-if的判断。

04. vue常用的修饰符？

分为事件修饰符和按键修饰符。

事件修饰符：

• .prevent: 提交事件不再重载页面；
• .stop: 阻止单击事件冒泡；
• .self: 当事件发生在该元素本身而不是子元素的时候会触发，冒泡上来的事件不执行
• .capture: 事件侦听，事件绑定遵循的不是冒泡的规则而是捕获的规则
• .once 修饰符表示只绑定一次事件，当触发后会自动解绑。

按键修饰符：

• .ctrl 即使Alt或者Shift被一同按下也会触发
• .ctrl.exact 有且只有Ctrl被按下才会触发
• .exact 没有任何系统修饰符被按下的时候才会触发

05. vue的computed methods watch

• computed 计算属性是一个函数，计算属性是内置缓存，当他依赖的变量没法发生改变的时候就不会执行，computed可以写成一个对象，里面有一个get方法，当走到读取计算属性时就走get方法，也有一个set方法，可以接收外部的变量，当依赖值改变时就会改变。
• methods 方法属性，没有缓存机制，在性能上不如计算属性。
• watch 侦听器 当监听的属性改变时进行重新赋值，这种方式与计算属性类似，都有一个缓存机制，当变量没有改变的时候不会执行。

06. watch监听引用类型，能否拿到oldVal？

watch监听引用类型，拿不到oldVal，因为指针相同，此时已经指向了新的val。

07. watch深度监听引用类型。

deep: true //深度监听

08. computed计算属性优点

• 使得数据处理结构清晰；
• 依赖于数据，数据更新，处理结果自动更新；
• 计算属性内部this指向vm实例；
• 在template调用时，直接写计算属性名即可；
• 常用的是getter方法，获取数据，也可以使用set方法改变数据；
• 相较于methods，不管依赖的数据变不变，methods都会重新计算，但是依赖数据不变的时候computed从缓存中获取，不会重新计算。

标签：02,vue,computed,修饰符,watch,面试,计算,属性
来源： https://www.cnblogs.com/chenfengbiji/p/14334634.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。