Fork me on GitThub

看了vue文档之后。。。。

  • 对于任何复杂逻辑,你都应当使用计算属性

  • html中的双花之内的值不一定来自data:{},还有可能来自computed:{}

  • 原数据改变,被绑定的计算属性也会改变

  • 可以将同一函数定义为一个方法而不是一个计算属性。两种方式的最终结果确实是完全相同的。然而,不同的是计算属性是基于它们的依赖进行缓存的。只在相关依赖发生改变时它们才会重新求值。

  • v-bind:class 指令也可以与普通的 class 属性共存
    绑定的数据对象class不必内联定义在模板里

  • Vue 为你提供了一种方式来表达“这两个元素是完全独立的,不要复用它们”。只需添加一个具有唯一值的 key 属性即可:复用!复用!

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

  • 当 v-if 与 v-for 一起使用时,v-for 具有比 v-if 更高的优先级。

  • 在 v-for 块中,我们拥有对父作用域属性的完全访问权限。v-for 还支持一个可选的第二个参数为当前项的索引。

  • 可以用 v-for 通过一个对象的属性来迭代,得到每个属性的值。第二个的参数做为键名,第三个参数为索引。

  • 建议尽可能在使用 v-for 时提供 key。

  • 当在组件中使用 v-for 时,key 现在是必须的。

  • vue不能检测到的数组变化:

  1. 直接利用索引修改某项;
  2. 修改数组长度

如何能让vue检测到这种变化呢?

// Vue.set
Vue.set(vm.items, indexOfItem, newValue)
// Array.prototype.splice
vm.items.splice(indexOfItem, 1, newValue)
vm.$set(vm.items, indexOfItem, newValue)
 vm.items.splice(newLength)
  • 使用 Vue.set(object, key, value) 方法向嵌套对象添加响应式属性:
vm.$set(vm.userProfile, 'age', 27)
Vue.set(vm.userProfile, 'age', 27)
  • 当它们处于同一节点,v-for 的优先级比 v-if 更高,这意味着 v-if 将分别重复运行于每个 v-for 循环中。
  • 有时也需要在内联语句处理器中访问原始的 DOM 事件。可以用特殊变量 $event 把它传入方法。
  • v-model 会忽略所有表单元素的 value、checked、selected 特性的初始值而总是将 Vue 实例的数据作为数据来源。你应该通过 JavaScript 在组件的 data 选项中声明初始值。
  • 在文本区域插值 () 并不会生效,应用 v-model 来代替。
  • v-model配select,第一个option要设为disabled value=""
  • 使用自定义组件前,先new Vue一下根标签作为根实例。
  • 一个组件的 data 选项必须是一个函数而不是对象
  • 全局注册的组件可以用在其被注册之后的任何 (通过 new Vue) 新创建的 Vue 根实例,也包括其组件树中的所有子组件的模板中。
posted @ 2018-09-11 14:56  林檎endymion  阅读(544)  评论(0编辑  收藏  举报