vue 文档

1.定义

vue是一款友好的多用途高性能的渐进式javascript框架

2. 指令

• 1. v-bind:
• 2. v-for 可以绑定数组的数据来渲染一个项目列表
• 3. v-if 条件控制
• 4. v-show
• 5. v-on: (@) 添加事件监听
• 6. v-model 表单输入应用状态之间的双向数据绑定
• 7. v-once 执行一次的插值,当数据改变时,插值处不会更新
• 8. v-html 输出html代码

data

• 1.当一个vue实例被创建时,他将data对象中的所有属性加入到Vue的响应式系中,当这些属性的值发生改变时,视图将会产生"响应",既匹配更新为新的值
• 2.当这些数据改变是,视图会进行重新渲染, 注意:只有当实例创建时就已经存在于data中的属性才是响应式的.
  -3. Object.freeze() 可以阻止响应追踪

实例属性和方法

• 1. $data
• 2. $el === document.getElementById("#id")
• 3. $watch 方法

声明周期

定义

每个vue 实例被创建时都需要经过一系列的初始化过程.这个过程中会运次那个生命周期的钩子函数.

• 注意: 不要在选项属性或者回调上使用箭头函数.

watch 和computed 和methods

• computed 和methods 用法和区别

1. computed是有缓存的(假设我们有一个性能开销比较大的计算属性 A，它需要遍历一个巨大的数组并做大量的计算。然后我们可能有其他的计算属性依赖于 A 。如果没有缓存，我们将不可避免的多次执行 A 的 getter)

2. 如果你不希望有缓存，请用方法来替代

• computed和watch 用法和区别

1. 当你有一些数据需要随着其它数据变动而变动时用computed
2. 数据变化时执行异步或开销较大的操作时，这个方式是最有用的(watch)

v-if和v-show

v-if 是“真正”的条件渲染，因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。

v-if 也是惰性的：如果在初始渲染时条件为假，则什么也不做——直到条件第一次变为真时，才会开始渲染条件块。

相比之下，v-show 就简单得多——不管初始条件是什么，元素总是会被渲染，并且只是简单地基于 CSS 进行切换。

一般来说，v-if 有更高的切换开销，而 v-show 有更高的初始渲染开销。因此，如果需要非常频繁地切换，则使用 v-show 较好；如果在运行时条件很少改变，则使用 v-if 较好。

v-for

在遍历对象时，会按 Object.keys() 的结果遍历，但是不能保证它的结果在不同的 JavaScript 引擎下都一致。

set 方法

• vm.$set(vm.userProfile, 'age', 27)
• vm.userProfile = Object.assign({}, vm.userProfile, {
  age: 27,
  favoriteColor: 'Vue Green'
  }) 多个值

事件修饰符