来完成一个缩水版Vuex

对 Vuex 源码举行浓缩,DIY 一个小型 Vuex

功用以下

  1. 经由过程 $store.commit 转变 $store.state
  2. 完成 strict model

源码约70行摆布比较好明白,下面解说一下两个比较主要的点。

install

Vue.use(Vuex)实际上挪用的是 Vuex 的 install 要领,该要领在每一个组件的 beforeCreate 钩子中为当前组件注入 $store,使一切组件的 $store 属性都指向同一个对象,也就是建立 Vue 实例时传入的 store 对象。

监听 store

为何当 state 对象发生变化时视图会被更新?原因是 store 内部建立了一个 Vue 对象对 state 举行监听(见源码 resetStoreVM 要领)。而且上面也提到,运用 Vuex 后,一切组件的 $store 都援用的都是同一个 store。所以当 state 变化时,绑定了 state 的视图都邑更新。

    原文作者:yejinzhan
    原文地址: https://segmentfault.com/a/1190000017049048
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞