VUE知识体系、VUE面试题-Toy模板网

这篇具有很好参考价值的文章主要介绍了VUE知识体系、VUE面试题。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

1. computed（计算属性）和方法有什么区别？

计算属性本质上是包含 getter 和 setter 的方法

当获取计算属性时，实际上是在调用计算属性的 getter 方法。vue 会收集计算属性的依赖，并缓存计算属性的返回结果。只有当依赖变化后才会重新进行计算。

方法没有缓存，每次调用方法都会导致重新执行。

计算属性的 getter 和 setter 参数固定，getter 没有参数，setter 只有一个参数。而方法的参数不限。

由于有以上的这些区别，因此计算属性通常是根据已有数据得到其它数据，并在得到数据的过程中不建议使用异步、当前时间、随机数等副作用操作。

实际上，它们最重要的区别是含义上的区别。计算属性含义上也是一个属性（data 属性），可以读取也可以赋值；方法含义上是一个操作，用于处理一些事情。

文章来源地址https://www.toymoban.com/news/detail-860072.html

2. v-if和v-show有什么区别？

v-if 能够控制是否生成 vnode（虚拟dom树），也就间接控制了是否生成对应dom。当 v-if 为 true 时，会生成对应 vnode，并生成对应的 dom 元素；当其为 false 时，不会生成对应 vnode，自然不会生成任何 dom 元素。v-if 是组件真正的渲染和销毁，而不是显示和隐藏

v-show 始终会生成 vnode，也就间接导致了始终生成 dom。它只是控制 dom 的 display 属性，当 v-show为 true 时，不做任何处理；当其为 false 时，生成的 dom 的 dispaly 属性为 none。v-show 是 CSS display 控制显示和隐藏

使用 v-if 可以有效的减少树的节点和渲染量，但也会导致树的不稳定；而使用 v-show 可以保持树的稳定，但不能减少树的节点和渲染量。

vue渲染节点越少效率越高，树越稳定效率越高。v-if节点少但树不稳定，v-show节点多但树稳定。

因此，在实际开发中，显示状态变化频繁的情况下应使用 v-show，以保持树的稳定；显示状态变化少时应该使用 v-if，以减少树的节点和渲染量。