• vue 对watch的使用 监听数据 并包含$store 数据变化的监听


    watch 实现监听数据改变

    使用方法

    watch:{

      data (n, m) {

       n: 变更后的数据

       m:变更前的数据

      }

    }

    以上方法 只有在数据发生改变的时候 才能监听到 这个时候 提供了参数 immediate 立即执行监听内的函数

    使用方法

    watch:{

      data (n, m) {

       n: 变更后的数据

       m:变更前的数据

      },

      immediate: true

    }

    如果遇到监听对象 以上的方法是无法实现的 那么我们就要监听对象内部参数 则watch 提供了 deep 参数 代表深入观察 

    实现方法

    watch:{

      object (n, m) {

       n: 变更后的数据

       m:变更前的数据

      },

      deep: true

    }

    以上使用 deep 方法的话 能实现想要的 但是~ 这样太麻烦了 因为这样的watch 会一层一层的查找 object  那么我们直接点找到想监听的对象key 就好了

    使用方法

    watch:{

      ‘object.key’ (n, m) {

       n: 变更后的数据

       m:变更前的数据

      }

    }

    以上直接找到 利用字符串形式 完美解决

    还有一种就是监听 store 就没办法用上面的直接监听了 那么我们利用计算属性来

    实现如下

    computed: {

      data () {

        return this.$store.getters.obj

      }

    }

    获得data  再对data进行监听 完美解决

    watch:{

      data (n, m) {

       n: 变更后的数据

       m:变更前的数据

      }

    }

  • 相关阅读:
    Java统计程序运行时间(转)
    有符号定点数的表示方法
    移位运算符
    索引
    self与super的区别(转)
    Java经典题型(未完成)
    ObjectiveC 的 self 和 super 详解
    边界计算与不对称边界
    各种排序总结
    运算符的优先级
  • 原文地址:https://www.cnblogs.com/wukongz/p/13589548.html
Copyright © 2020-2023  润新知