zoukankan      html  css  js  c++  java
  • vue容易混淆的点小记

    computed、methods及watch函数的差异

    computed:基于依赖进行缓存,若依赖不变,则直接调用缓存(适用于性能开销比较大的时候)

    methods: 不管数据是否变更,都会进行计算(适用于不需要缓存的时候)

    watch: 跟computed有异曲同工之妙,不同的是,其可以设置中间状态(适用于当数据发生变化时执行异步或者开销较大的操作)

    数组更新检测

    由于js限制,Vue不能检测一下变动的数组:

    1.通过索引直接设置一个项,如:vm.items[index] = newValue;

    解决方法一:Vue.set(vm.items, index, newValue);

    解决方法二:vm.$set(vm.items, index, newValue);   【vm.$set实例方法是全局方法Vue.set的别名】

    解决方法三:vm.items.splice(index, 1,  newValue);

    2.修改数组长度,如:vm.items.length = newLen;

    解决方法:vm.items.splice(newLen);

     

    对象更新检测

    同样由于js限制,Vue不能检测对象属性的添加或删除

    如:var vm = new Vue({

    data: {

    userInfo:  {

    name: '淼淼'

    }

    })

    vm.userInfo.age = 26  // 非响应式,故添加无效

    //解决方法一

    Vue.set(vm.userInfo, 'age', 26)

    //解决方法二

    vm.$set(vm.userInfo, 'gender', 'female')

    // 添加属性对象

    vm.userInfo = Object.assign({}, vm.userInfo, {

    'addr': '成都',

    'hobby': '阅读'

    })

  • 相关阅读:
    LeetCode 204
    华为OJ2051-最小的K个数(Top K问题)
    华为OJ1964-求解立方根(牛顿迭代法)
    华为OJ2288-合唱队(最长递增子序列)
    华为OJ2011-最长公共子串
    【Unix编程】进程间通信(IPC)
    可利用空间表(Free List)
    13.10 Scrapy 通用爬虫
    13.9 Scrapy 对接 Splash
    第十四章 分布式爬虫
  • 原文地址:https://www.cnblogs.com/ganmy/p/10644402.html
Copyright © 2011-2022 走看看