SourceCode： 5 篇

前言​

vue 中的 diff 算法是基于 vnode 实现的，vnode 简单来说就是将 dom 结构用 js 对象来表示，方便我们进行处理。

vnode 的部分属性如下：

export interface VNode {
  type: VNodeTypes // VNode 类型
  props: VNodeProps | null
  key: string | number | null // 用于 diff
  children: VNodeChildren // 子节点

  // 性能优化
  shapeFlag: number
  patchFlag: number
}

vuex 介绍​

我们先来介绍一下 vuex 中的一些概念

我们根据 vuex 的工作流程来说

• 改变state的唯一途径就是提交mutations
• 如果是异步的，就派发 (dispatch)actions，其本质还是提交mutations
• 提交mutations后，可以动态的渲染组件Vue Components

觉得是不是少了什么，没错，就是getters 下面实现的时候会说

Redux 的核心思想​

Redux 是 JavaScript 状态容器，能提供可预测化的状态管理。

nextTick 的作用​

官方的介绍是

将回调推迟到下一个 DOM 更新周期之后执行。在更改了一些数据以等待 DOM 更新后立即使用它。

在 vue 中数据发生变化后，dom 的更新是需要一定时间的，而我们在数据更新之后就立即去操作或者获取 dom 的话，其实还是操作和获取的未更新的 dom ，而我们可以调用 nextTick 拿到最新的 dom

按响应流程和简化版源码来分析响应式系统