• 看了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 根实例,也包括其组件树中的所有子组件的模板中。
  • 相关阅读:
    JS小记
    chrome 插件开发
    js闭包理解
    文件名后缀详解
    Glut 回调函数小结
    vc++ 6.0下Glut的配置 及 Glut 框架介绍
    数字图像点运算实践 (直方图均衡和分段线性拉伸)
    event.keycode值大全
    Bookmarklet
    牛人经典语录
  • 原文地址:https://www.cnblogs.com/endymion/p/9627679.html
Copyright © 2020-2023  润新知