登录免费注册



Vue源码01

首页  思维导图  详情



Vue源码01

2020-10-13 18:16:39   4  举报





AI智能生成

vue源码初始化流程和响应式原理分析

vue

源码分析

响应式原理

模版推荐

作者其他创作

大纲/内容

初始化流程

入口文件：覆盖$mount<br>platforms/web/entry-runtime-with-compiler

web运行时代码：实现$mount<br>platforms/web/runtime/index

$mount

__patch__

全局api定义<br>core/index

core/global-api/index

set

delete

nextTick

...

Vue构造函数<br>core/instance/index

initMixin：实现_init()<br>core/instance/init.js

initLifecycle

initEvents

initRender

beforeCreate

initInjections

initState

initProvide

created

stateMixin

$data,$props,$set,$delete,$watch<br>

eventsMixin

$on,$emit,$once,$off

lifecycleMixin

_update,$forceUpdate,$destroy

renderMixin

$nextTick,_render

数据响应式

data的数据响应式<br>src/core/instance/state.js<br>

initState()<br>数据响应式起始

observe()<br>返回ob实例，ob对value做响应式

Observer<br>判断value类型，创建小秘书ob

walk()

defineReactive()<br>数据的访问拦截

observeArray()

Dep<br>依赖管理，变更通知

两种dep的作用

Watcher<br>和组件挂钩或者和用户定义的观察表达式挂钩，数据变更后执行更新

dep和watcher之间的映射规则

array.js<br>数组的特殊处理，覆盖能够改变数组的7个方法

 Collect

Get Started

Vue源码解析

01ofbiz_01permission_01design

 Collect

Get Started

01ofbiz_01permission_01design

 Collect

Get Started

Vue 源码一

 Collect

Get Started

Vue源码分析













评论

0 条评论

下一页



图形选择

思维导图

主题

补充说明

AI生成





修改AI描述

去编辑

重新生成

提示 

关闭后当前内容将不会保存，是否继续？

取消

确定

Document