Skip to main content

Questions

HTML#

重排重绘

CSS#

画三角形#

.span {  width: 0px;  height: 0px;  border-width: 30px;  border-style: solid;  border-color: yellow yellow transparent transparent;  /* transform:rotate(180deg) */}

JavaScript#

ES6#

Promise 应用

Vue#

生命周期#

beforeDestroy 什么时候应用

陈诉理解,钩子函数

reactive#

reactive 原理

自定义组件间的数据双向绑定

Vue 监控属性值的变化

MVVM 模式的理解

v-if v-show 的性能消耗差异

delete Vue.delete 数组元素的区别

Data Property#

直接将不包含在 data 中的新 property 添加到组件实例是可行的。但由于该 property 不在背后的响应式 $data 对象内,所以 Vue 的响应性系统不会自动跟踪它。关于为什么data选项是一个函数click here

this#

Vue 自动为 methods property 绑定 this,以便于它始终指向组件实例。这将确保方法在用作事件监听或回调时保持正确的 this 指向。在定义 methods 时应避免使用箭头函数,因为这会阻止 Vue 绑定恰当的 this 指向。

React 并没有这么做,所以需要在 constructor 函数里显示绑定 this,而这显得很繁琐,直到 Hooks 出现。

methods#

从模板调用的方法不应该有任何副作用,比如更改数据或触发异步进程。如果你想这么做,应该使用 Lifecycle Hooks

computed#

计算属性只在相关响应式依赖发生改变时它们才会重新求值。

这也同样意味着下面的计算属性将不再更新,因为 Date.now () 不是响应式依赖:

computed: {  now() {    return Date.now()  }}

watch#

watch 选项提供了一个更通用的方法,来响应数据的变化。当需要在数据变化时执行异步(使用 axios 访问一个 API)或开销较大的操作时,这个方式是最有用的。

除了 watch 选项之外,你还可以使用命令式的 vm.$watch API

性能优化的方案#

参考#