iT邦幫忙

第 12 屆 iThome 鐵人賽

0
Modern Web

Vue菜鳥的自我學習days系列 第 33

33.Vuex項目結構

  • 分享至 

  • xImage
  •  

1.应用层级的状态应该集中到单个 store 对象中。
2.提交 mutation 是更改状态的唯一方法,并且这个过程是同步的。
3.异步逻辑都应该封装到 action 里面。
如果你的 store 文件太大,只需将 action、mutation 和 getter 分割到单独的文件。

store
    ├── index.js          # 我们组装模块并导出 store 的地方
    ├── actions.js        # 根级别的 action
    ├── mutations.js      # 根级别的 mutation
    └── modules
        ├── cart.js       # 购物车模块
        └── products.js   # 产品模块

严格模式
在创建 store 的时候传入 strict: true

const store = new Vuex.Store({
  // ...
  strict: true
})

在严格模式下,无论何时发生了状态变更且不是由 mutation 函数引起的,将会抛出错误。
※不要在发布环境下启用严格模式!严格模式会深度监测状态树来检测不合规的状态变更——请确保在发布环境下关闭严格模式,以避免性能损失,可以在store做環境判斷:

const store = new Vuex.Store({
  // ...
  strict: process.env.NODE_ENV !== 'production'
})

上一篇
32.Module2
下一篇
34.Form Handling
系列文
Vue菜鳥的自我學習days39
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言