zoukankan      html  css  js  c++  java
  • vuex原理笔记

    本文总结自: https://tech.meituan.com/vuex-code-analysis.html, 将要点提炼为笔记,以便不时之需,安不忘危。

    核心可分为两部分: 

    1.vue.use(Vuex)

    本质上执行Vuex的install方法,参数为Vue

    Vue赋给局部对象

    调用applyMixin()

    Vue生命周期里添加vuexInit

    层层嵌套添加$store

    2.创建store实例

    前提是必须调用过Vue.use(Vuex),必须支持Promise

    初始化基本属性(比如committing,用来监测是否非法修改state;比如_modulesNamespaceMap,用来存储命名空间)

    初始化moduleCollection,参数为option对象,来创建module对象树

    原型dispatch方法、commit方法封装,使其第一个参数为state

    其中commit内通过_withCommit来修改状态,这是唯一的合法方法

    严格模式设置

    installModule(),模块安装,初始化组件树的根模块

    其中installModule()主要完成:

    如果有命名空间,将模块添加进store._modulesNamespaceMap这个数组里

    如果不是根组件且非hot,将其state设置到父级state的moduleName属性上

    makeLocalContext()上下文环境设置,根据命名空间为模块设置局部dispatch、commit、getter和state

    注册对应模块的mutation、action、getter

    递归地为子module调用installModule

    resetVM,store的初始化

    植入devtoolPlugin并提供"时空穿梭功能"

    state内部如何支持模块配置与模块嵌套的?

    store对象构造过程中会调用makeLocalContext(创建本地上下文),每一个module都有一个上下文环境,与配置时的路径匹配,因此dispatch('a', b)等时,默认拿到的是local state,如果需要服务外层或其他module的state,只能根据rootState沿路径逐步访问。

  • 相关阅读:
    设计师必备:来自顶级设计师的建议清单
    Qt 控制线程的顺序执行(使用QWaitCondition,并且线程类的run函数里记得加exec(),使得线程常驻)
    Qt 模拟鼠标点击(QApplication::sendEvent(ui->pushbutton, &event0);)
    利用Qt开发跨平台APP(二)(iOS,使用Qt5.9,很详细,有截图)
    C# RESTful API
    NET架构
    一个宏实现
    初步了解 Netty
    使用Rabbit MQ消息队列
    NET CORE与Spring Boot
  • 原文地址:https://www.cnblogs.com/yanze/p/8287061.html
Copyright © 2011-2022 走看看