美文网首页
深入浅出vue.js

深入浅出vue.js

作者: 海豚先生的博客 | 来源:发表于2022-02-25 08:55 被阅读0次

渐进式框架

视图层渲染-组件机制-路由机制-状态管理-构建工具
你可以使用只使用视图层渲染快速开发,也可以使用全家桶开发大型项目

object的变化侦测

  • Dep类专门用来收集依赖、删除依赖、向依赖发送通知
  • vue2.0最小的依赖是组件级别,从而减小dom级别依赖过多,内存开销大的问题
  • Watcher类是一个中介角色,dep中依赖收集的即是watcher实例,数据变化时dep循环
    通知watcher实例,watcher实例再通知其他地方(比如调用回调函数)
  • Observer类将递归object所有属性转换为getter/setter


    image.png
  • vue2.x使用Object.defineProperty侦测对象
  • Object收集依赖在getter中,每个key都有一个Dep列表来存储依赖,触发依赖是在setter中,循环依赖列表触发更新
  • 收集依赖其实就是收集的Watcher实例

array的变化侦测

  • 支持proto时,使用拦截器覆盖Array的原型(拦截器是Array原型的实例)

    WechatIMG3.jpeg
  • 不支持proto时,将拦截器方法挂载到数组的每个value属性上

    WechatIMG2.jpeg
  • Array在getter中收集依赖,在拦截器中触发依赖

  • array的依赖列表存在observer中

相关文章

  • 《深入浅出 Vue.js》书评

    本书信息: ISBN:9787115509055 豆瓣读书:《深入浅出 Vue.js》[https://book....

  • Vue代码规范——组件/实例选项顺序

    组件/实例选项应该有统一的顺序。下面是Vue.js 官方推荐的组件选项默认顺序。参考《深入浅出Vue.js》。 挂...

  • Vue基础篇(四)

    本教程分为三部分 : 基础 进阶 实战 ,深入浅出Vue.js基础篇持续 更新中 第五章 Vue.JS中的内置指令...

  • Vue基础篇(一)

    本教程分为三部分 : 基础 进阶 实战 ,深入浅出Vue.基础篇持续 更新中 --- vue.js的基本介绍和...

  • Vue基础篇(五)

    本教程分为三部分 : 基础 进阶 实战 ,深入浅出Vue.js基础篇持续 更新中 ------ 列表渲染指令v-­...

  • Vue基础篇(六)

    本教程分为三部分 : 基础 进阶 实战 ,深入浅出Vue.js基础篇持续 更新中........ 第六章 表单与v...

  • 深入浅出vue.js

    渐进式框架 视图层渲染-组件机制-路由机制-状态管理-构建工具你可以使用只使用视图层渲染快速开发,也可以使用全家桶...

  • 本科学历之于工作有感

    半年前工作要求刚开始接触前端,朋友推荐了一本《深入浅出Vue.js》,买来半年没看过,翻开过,但看不懂。 进了《深...

  • vue知识点-2--$watch、$set、$delete内部原

    本文相当于笔记,最近在看深入浅出vue.js的记录,需要配合书一起看,如果你也在看这本书可以一起看看这篇文章,不然...

  • vue知识点-1--变化侦测-依赖收集

    本文相当于笔记,最近在看深入浅出vue.js的记录,需要配合书一起看,如果你也在看这本书可以一起看看这篇文章,不然...

网友评论

      本文标题:深入浅出vue.js

      本文链接:https://www.haomeiwen.com/subject/fddtrrtx.html