vue源码注释系列 /src/module/module.js

import { forEachValue } from "../util";// Base data struct for store's module, package with some attribute and method
export default class Module {/*** rawModule 就是 {*  actions: {},*  state: {},*  mutations: {},*  getters: {},*  modules: {*      users: {*          namespace: true,*          actions: {},*          state: {},*          mutations: {},*          getters: {}*      },*      books: {*      `namespace: true,*        ...*      }*  }* }*//*module 实例形式为： {//context 是在 store.js 中的 installModule 创建的。context: {dispatch: xxx, //能找到当前 module 中 action 的 dispatch。commit: xxx,   //能找到当前 module 中 mutation 的 commit。getters: xxx,  //获取当前 module 中的 getters。state: xxxx    //获取当前 module 中的 state/}_children: {xxxx },_rawModule: options,state: rawModule.state //state 可以是对象或者函数}*/constructor(rawModule, runtime) {this.runtime = runtime;this._children = Object.create(null);// Store the origin module object which passed by programmerthis._rawModule = rawModule;const rawState = rawModule.state;// Store the origin module's statethis.state = (typeof rawState === "function" ? rawState() : rawState) || {};}/*判断是否开启命名空间*/get namespaced() {return !!this._rawModule.namespaced;}/*将 options.modules 中的 value 转化为 Module 实例，并存储在 _children 映射中。*/addChild(key, module) {this._children[key] = module;}/*通过 key 将子 Module 实例移除。*/removeChild(key) {delete this._children[key];}/* 通过 key 获取子 Module 实例。*/getChild(key) {return this._children[key];}/*判断是否有 key 名称的命名空间的 Module 实例。*/hasChild(key) {//_children 是个 Map 实例。即 _children = {}.return key in this._children;}/*更新当前 Module 实例的数据。*/update(rawModule) {//替换命名空间属性。this._rawModule.namespaced = rawModule.namespaced;//替换掉 actions。if (rawModule.actions) {this._rawModule.actions = rawModule.actions;}//替换掉 mutations。if (rawModule.mutations) {this._rawModule.mutations = rawModule.mutations;}//替换掉 getters。if (rawModule.getters) {this._rawModule.getters = rawModule.getters;}//并没有 state。}forEachChild(fn) {//forEachValue 对应为 Object.keys(obj).forEach(key => fn(obj[key], key))//this._children 对应 this._children//fn 就是 ( children_value, children_key )=>{ xxxx }forEachValue(this._children, fn);}/*** 遍历 rawModule 中的 getters 遍历。 从外传入的函数将得到遍历 getters 中所有的属性。* 第一个回传给 fn 的参数为  getters 中属性的 value。* 第二个回传给 fn 的参数为  getters 中属性的 key。*/forEachGetter(fn) {if (this._rawModule.getters) {forEachValue(this._rawModule.getters, fn);}}/*** 遍历 rawModule 中的 actions 遍历。 从外传入的函数将得到遍历 actions 中所有的属性。* ==> 第一个回传给 fn 的参数为  actions 中属性的 value。* ==> 第二个回传给 fn 的参数为  actions 中属性的 key。* 其中 action 可以是个对象或者函数。* actions: {*  updateUserName(){*    xxxxx*  },*  updateUserInfo: {*    root: true,*    handler: function(){ ... }*  }* }*/forEachAction(fn) {if (this._rawModule.actions) {forEachValue(this._rawModule.actions, fn);}}/*** 遍历 rawModule 中的 mutations 遍历。 从外传入的函数将得到遍历 mutations 中所有的属性。* 第一个回传给 fn 的参数为  mutations 中属性的 value。* 第二个回传给 fn 的参数为  mutations 中属性的 key。*/forEachMutation(fn) {if (this._rawModule.mutations) {forEachValue(this._rawModule.mutations, fn);}}
}

vue源码注释系列 /src/module/module.js相关推荐

vue-router3 源码注释系列 /src/util/query.js
/* @flow */import { warn } from './warn'//判断字符为 !'()* 的正则表达式. const encodeReserveRE = /[!'()*]/g /* ...
vue-router3 源码注释系列 /src/util/scroll.js
/* @flow */import type Router from '../index' import { assert } from './warn' //getStateKey: 用于获取时间戳 ...
vue-router3 源码注释系列 /src/util/push-state.js
/* @flow *///用于判断是否是浏览器环境 import { inBrowser } from './dom' //保存滚动的位置(x,y). import { saveScrollPosit ...
vue-router3 源码注释系列 /src/util/path.js
/* @flow *//*** resolvePath(): 解析路径* 第一个参数: 相对路径,要跳转路径的 pathname.* 第二个参数: 基准路径.* 第三个参数: 是否需要拼接基准地址.* ...
vue 计算属性_lt;Vue 源码笔记系列6gt;计算属性 computed 的实现
1. 前言原文发布在语雀: <Vue 源码笔记系列6>计算属性 computed 的实现 · 语雀www.yuque.com 上一章我们已经学习过 watch,这一章就来看一下计算属性 ...
vue如何让一句代码只执行一次_lt;Vue 源码笔记系列4gt;异步更新队列与$nextTick...
1. 前言原文发布在语雀: <Vue 源码笔记系列4>异步更新队列与$nextTick · 语雀www.yuque.com 上一章我们讲到了修改数据是如何触发渲染函数的观察者,最终调用 ...
vue源码分析系列二：$mount()和new Watcher()的执行过程
续vue源码分析系列一:new Vue的初始化过程在initMixin()里面调用了$mount() if (vm.$options.el) {vm.$mount(vm.$options.el);/ ...
Vue源码解析系列——数据驱动篇：patch的执行过程
准备 vue版本号2.6.12,为方便分析,选择了runtime+compiler版本. 回顾如果有感兴趣的同学可以看看我之前的源码分析文章,这里呈上链接:<Vue源码分析系列:目录> ...
vue源码分析系列一：new Vue的初始化过程
import Vue from 'vue'(作者用的vue-cli一键生成) node环境下import Vue from 'vue'的作用是什么意思? 在 NPM 包的 dist/ 目录你将会找到很 ...

vue源码注释系列 /src/module/module.js

vue源码注释系列 /src/module/module.js相关推荐

最新文章

热门文章