Skip to content

Commit aac0889

Browse files
JinjiangJustineo
andauthored
docs(zh): update (#1718)
* docs(zh): update * Apply suggestions from code review Co-Authored-By: GU Yiling <[email protected]> Co-authored-by: GU Yiling <[email protected]>
1 parent 4fa68ab commit aac0889

File tree

3 files changed

+47
-1
lines changed

3 files changed

+47
-1
lines changed

docs/zh/api/README.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -239,6 +239,14 @@ const store = new Vuex.Store({ ...options })
239239
240240
卸载一个动态模块。[详细介绍](../guide/modules.md#模块动态注册)
241241
242+
### hasModule
243+
244+
- `hasModule(path: string | Array<string>)`
245+
246+
检查该模块的名字是否已经被注册。[详细介绍](../guide/modules.md#模块动态注册)
247+
248+
> 3.2.0 新增
249+
242250
### hotUpdate
243251
244252
- `hotUpdate(newOptions: Object)`

docs/zh/guide/README.md

Lines changed: 33 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,8 @@
1717
[安装](../installation.md) Vuex 之后,让我们来创建一个 store。创建过程直截了当——仅需要提供一个初始 state 对象和一些 mutation:
1818

1919
``` js
20-
// 如果在模块化构建系统中,请确保在开头调用了 Vue.use(Vuex)
20+
import Vue from 'vue'
21+
import Vuex from 'vuex'
2122

2223
const store = new Vuex.Store({
2324
state: {
@@ -39,6 +40,37 @@ store.commit('increment')
3940
console.log(store.state.count) // -> 1
4041
```
4142

43+
为了在 Vue 组件中访问 `this.$store` property,你需要为 Vue 实例提供创建好的 store。Vuex 提供了一个从根组件向所有子组件,以 `store` 选项的方式“注入”该 store 的机制:
44+
45+
``` js
46+
new Vue({
47+
el: '#app',
48+
store: store,
49+
})
50+
```
51+
52+
:::tip 提示
53+
如果使用 ES6,你也可以以 ES6 对象的 property 简写 (用在对象某个 property 的 key 和被传入的变量同名时):
54+
55+
```js
56+
new Vue({
57+
el: '#app',
58+
store
59+
})
60+
```
61+
:::
62+
63+
现在我们可以从组件的方法提交一个变更:
64+
65+
``` js
66+
methods: {
67+
increment() {
68+
this.$store.commit('increment')
69+
console.log(this.$store.state.count)
70+
}
71+
}
72+
```
73+
4274
再次强调,我们通过提交 mutation 的方式,而非直接改变 `store.state.count`,是因为我们想要更明确地追踪到状态的变化。这个简单的约定能够让你的意图更加明显,这样你在阅读代码的时候能更容易地解读应用内部的状态改变。此外,这样也让我们有机会去实现一些能记录每次状态改变,保存状态快照的调试工具。有了它,我们甚至可以实现如时间穿梭般的调试体验。
4375

4476
由于 store 中的状态是响应式的,在组件中调用 store 中的状态简单到仅需要在计算属性中返回即可。触发变化也仅仅是在组件的 methods 中提交 mutation。

docs/zh/guide/modules.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -280,6 +280,10 @@ export function createPlugin (options = {}) {
280280
在 store 创建**之后**,你可以使用 `store.registerModule` 方法注册模块:
281281

282282
``` js
283+
import Vuex from 'vuex'
284+
285+
const store = new Vuex.Store({ /* 选项 */ })
286+
283287
// 注册模块 `myModule`
284288
store.registerModule('myModule', {
285289
// ...
@@ -296,6 +300,8 @@ store.registerModule(['nested', 'myModule'], {
296300

297301
你也可以使用 `store.unregisterModule(moduleName)` 来动态卸载模块。注意,你不能使用此方法卸载静态模块(即创建 store 时声明的模块)。
298302

303+
注意,你可以通过 `store.hasModule(moduleName)` 方法检查该模块是否已经被注册到 store。
304+
299305
#### 保留 state
300306

301307
在注册一个新 module 时,你很有可能想保留过去的 state,例如从一个服务端渲染的应用保留 state。你可以通过 `preserveState` 选项将其归档:`store.registerModule('a', module, { preserveState: true })`

0 commit comments

Comments
 (0)