zoukankan      html  css  js  c++  java
  • Vue 框架怎么实现对象和数组的监听?

    如果被问到 Vue 怎么实现数据双向绑定,大家肯定都会回答 通过 Object.defineProperty() 对数据进行劫持,但是 Object.defineProperty() 只能对属性进行数据劫持,不能对整个对象进行劫持。
    同理无法对数组进行劫持,但是我们在使用 Vue 框架中都知道,Vue 能检测到对象和数组(部分方法的操作)的变化,那它是怎么实现的呢?我们查看相关代码如下:

      /**
       * Observe a list of Array items.
       */
      observeArray (items: Array<any>) {
        for (let i = 0, l = items.length; i < l; i++) {
          observe(items[i])  // observe 功能为监测数据的变化
        }
      }
    
      /**
       * 对属性进行递归遍历
       */
      let childOb = !shallow && observe(val) // observe 功能为监测数据的变化

    通过以上 Vue 源码部分查看,我们就能知道 Vue 框架是通过遍历数组 和递归遍历对象,从而达到利用 Object.defineProperty() 也能对对象和数组(部分方法的操作)进行监听。

  • 相关阅读:
    误卸载python2.4导致yum不能用后的修复
    网卡流量查看软件bmon
    DTD约束
    Schema约束
    SAX解析原理示意
    DOM解析原理示意
    XML中文乱码问题
    Web应用的目录结构
    手动+工具开发动态资源
    Tomcat服务器的下载及安装
  • 原文地址:https://www.cnblogs.com/Rivend/p/12629880.html
Copyright © 2011-2022 走看看