File tree 2 files changed +10
-2
lines changed
2 files changed +10
-2
lines changed Original file line number Diff line number Diff line change @@ -32,7 +32,9 @@ const store = new Vuex.Store({
32
32
})
33
33
```
34
34
35
- Getter 会暴露为 ` store.getters ` 对象:
35
+ ### 通过属性访问
36
+
37
+ Getter 会暴露为 ` store.getters ` 对象,你可以以属性的形式访问这些值:
36
38
37
39
``` js
38
40
store .getters .doneTodos // -> [{ id: 1, text: '...', done: true }]
@@ -63,6 +65,10 @@ computed: {
63
65
}
64
66
```
65
67
68
+ 注意,getter 在通过属性访问时是作为 Vue 的响应式系统的一部分缓存其中的。
69
+
70
+ ### 通过方法访问
71
+
66
72
你也可以通过让 getter 返回一个函数,来实现给 getter 传参。在你对 store 里的数组进行查询时非常有用。
67
73
68
74
``` js
@@ -78,6 +84,8 @@ getters: {
78
84
store .getters .getTodoById (2 ) // -> { id: 2, text: '...', done: false }
79
85
```
80
86
87
+ 注意,getter 在通过方法访问时,每次都会去进行调用,而不会缓存结果。
88
+
81
89
### ` mapGetters ` 辅助函数
82
90
83
91
` mapGetters ` 辅助函数仅仅是将 store 中的 getter 映射到局部计算属性:
Original file line number Diff line number Diff line change @@ -91,7 +91,7 @@ computed: mapState([
91
91
92
92
### 对象展开运算符
93
93
94
- ` mapState ` 函数返回的是一个对象。我们如何将它与局部计算属性混合使用呢?通常,我们需要使用一个工具函数将多个对象合并为一个,以使我们可以将最终对象传给 ` computed ` 属性。但是自从有了[ 对象展开运算符] ( https://github.com/sebmarkbage/ecmascript-rest-spread ) (现处于 ECMASCript 提案 stage-3 阶段),我们可以极大地简化写法:
94
+ ` mapState ` 函数返回的是一个对象。我们如何将它与局部计算属性混合使用呢?通常,我们需要使用一个工具函数将多个对象合并为一个,以使我们可以将最终对象传给 ` computed ` 属性。但是自从有了[ 对象展开运算符] ( https://github.com/sebmarkbage/ecmascript-rest-spread ) (现处于 ECMASCript 提案 stage-4 阶段),我们可以极大地简化写法:
95
95
96
96
``` js
97
97
computed: {
You can’t perform that action at this time.
0 commit comments