Browse Source

docs(zh): update b40ee5d...7409ad4 (#1772)

Jinjiang 5 năm trước cách đây
mục cha
commit
2a4dbe1cca
3 tập tin đã thay đổi với 85 bổ sung3 xóa
  1. 27 3
      docs/zh/api/README.md
  2. 47 0
      docs/zh/guide/hot-reload.md
  3. 11 0
      docs/zh/guide/plugins.md

+ 27 - 3
docs/zh/api/README.md

@@ -176,7 +176,7 @@ const store = new Vuex.Store({ ...options })
 
 ### subscribe
 
-- `subscribe(handler: Function): Function`
+- `subscribe(handler: Function, options?: Object): Function`
 
   订阅 store 的 mutation。`handler` 会在每个 mutation 完成后调用,接收 mutation 和经过 mutation 后的状态作为参数:
 
@@ -187,13 +187,18 @@ const store = new Vuex.Store({ ...options })
   })
   ```
 
+  默认情况下,新的处理函数会被添加到其链的尾端,因此它会在其它之前已经被添加了的处理函数之后执行。这一行为可以通过向 `options` 添加 `prepend: true` 来覆写,即把处理函数添加到其链的最开始。
+
+  ``` js
+  store.subscribe(handler, { prepend: true })
+  ```
   要停止订阅,调用此方法返回的函数即可停止订阅。
 
   通常用于插件。[详细介绍](../guide/plugins.md)
 
 ### subscribeAction
 
-- `subscribeAction(handler: Function): Function`
+- `subscribeAction(handler: Function, options?: Object): Function`
 
   > 2.5.0 新增
 
@@ -206,6 +211,12 @@ const store = new Vuex.Store({ ...options })
   })
   ```
 
+  默认情况下,新的处理函数会被添加到其链的尾端,因此它会在其它之前已经被添加了的处理函数之后执行。这一行为可以通过向 `options` 添加 `prepend: true` 来覆写,即把处理函数添加到其链的最开始。
+
+  ``` js
+  store.subscribeAction(handler, { prepend: true })
+  ```
+
   要停止订阅,调用此方法返回的函数即可停止订阅。
 
   > 3.1.0 新增
@@ -223,7 +234,20 @@ const store = new Vuex.Store({ ...options })
   })
   ```
 
-  该功能常用于插件。[详细介绍](../guide/plugins.md)
+  > 3.4.0 新增
+
+  自 3.4.0 起,`subscribeAction` 也可以指定一个 `error` 处理函数以捕获分发 action 的时候被抛出的错误。该函数会从第三个参数接收到一个 `error` 对象。
+
+  ``` js
+  store.subscribeAction({
+    error: (action, state, error) => {
+      console.log(`error action ${action.type}`)
+      console.error(error)
+    }
+  })
+  ```
+
+  该 `subscribeAction` 方法常用于插件。[详细介绍](../guide/plugins.md)
 
 ### registerModule
 

+ 47 - 0
docs/zh/guide/hot-reload.md

@@ -42,3 +42,50 @@ if (module.hot) {
 ```
 
 参考热重载示例 [counter-hot](https://github.com/vuejs/vuex/tree/dev/examples/counter-hot)。
+
+## 动态模块热重载
+
+如果你仅使用模块,你可以使用 `require.context` 来动态地加载或热重载所有的模块。
+
+```js
+// store.js
+import Vue from 'vue'
+import Vuex from 'vuex'
+
+// 加载所有模块。
+function loadModules() {
+  const context = require.context("./modules", false, /([a-z_]+)\.js$/i)
+
+  const modules = context
+    .keys()
+    .map((key) => ({ key, name: key.match(/([a-z_]+)\.js$/i)[1] }))
+    .reduce(
+      (modules, { key, name }) => ({
+        ...modules,
+        [name]: context(key).default
+      }),
+      {}
+    )
+
+  return { context, modules }
+}
+
+const { context, modules } = loadModules()
+
+Vue.use(Vuex)
+
+const store = new Vuex.Store({
+  modules
+})
+
+if (module.hot) {
+  // 在任何模块发生改变时进行热重载。
+  module.hot.accept(context.id, () => {
+    const { modules } = loadModules()
+
+    store.hotUpdate({
+      modules
+    })
+  })
+}
+```

+ 11 - 0
docs/zh/guide/plugins.md

@@ -109,6 +109,11 @@ const logger = createLogger({
     // 顺便,`mutation` 是个 { type, payload } 对象
     return mutation.type !== "aBlacklistedMutation"
   },
+  actionFilter (action, state) {
+    // 和 `filter` 一样,但是是针对 action 的
+    // `action` 的格式是 `{ type, payload }`
+    return action.type !== "aBlacklistedAction"
+  },
   transformer (state) {
     // 在开始记录之前转换状态
     // 例如,只返回指定的子树
@@ -119,6 +124,12 @@ const logger = createLogger({
     // 我们可以按任意方式格式化
     return mutation.type
   },
+  actionTransformer (action) {
+    // 和 `mutationTransformer` 一样,但是是针对 action 的
+    return action.type
+  },
+  logActions: true, // 记录 action 日志
+  logMutations: true, // 记录 mutation 日志
   logger: console, // 自定义 console 实现,默认为 `console`
 })
 ```