Vuex 原理解析
2021-04-04 18:43:03 1 举报AI智能生成
vuex 原理解析
作者其他创作
大纲/内容
usage
引入vuex(import vuex)
安装vuex(Vue.use(vuex))
install
applyMixin
实例化store
new Vuex.Store(options)
实例化store对象注入到Vue根组件
install
缓存参数Vue，方便Store中使用
Vue.mixin为所有组件设置$store属性
module collection
管理 module
源码路径：src/module/module-collection.js
prototype
register
递归注册module树形结构
get
通过path来获取到对应的子模块
getNamespace
获取命名空间
update
更新 module
unregister
取消注册
isRegistered
判断是否已经注册
生成module
runtime
_children
_rawModule
state
prototype
get namespaced
获取模块命名空间，返回布尔值
addChild
添加子模块
removeChild
删除子模块
getChild
获取子模块
hasChild
判断是否拥有子模块
update
更新namespaced, actions, mutations, getters
forEachChild
遍历_children
forEachGetter
遍历getters
forEachAction
遍历action
forEachMutation
遍历mutations
installModule
拼接命名空间（getNamespace)
注册state，并通过Vue.set保证响应式
生成当前模块（makeLocalContext)
state
getNestedState
getters
commit
检测是否异步更改state
dispatch
注册mutations
registerMutation
注册actions
registerAction
注册getters
registerGetter
子模块递归安装
resetStoreVM
生成 store.getters
创建 Vue 实例
data：保证 state 响应式
执行所有mutations
computed: 使getter只在依赖的state变化时才会重新计算
开启严格模式(enableStrictMode)
插件安装 plugins
dynamic module register
module collection
install module
reset store vm
helper
mapState
mapMutations
mapGetters
mapActions
createNamespacedHelpers
学习文档
Vuex源码解析
Vuex框架原理与源码分析
Vuex源码解析
vuex 源码解析
自由主题
0 条评论
下一页
