You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/en/getters.md
+29Lines changed: 29 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,5 +1,34 @@
1
1
# Getters
2
2
3
+
Each getter is a function used to transform and compose the store data into a consumable format, either for the UI or another purpose. It returns a value computed from the store state:
4
+
5
+
```js
6
+
importVuexfrom'vuex'
7
+
8
+
conststore=newVuex.Store({
9
+
state: {
10
+
values: [0, 9, 18]
11
+
},
12
+
getters: {
13
+
total (state) {
14
+
returnstate.values.reduce((a, b) => a + b)
15
+
}
16
+
}
17
+
})
18
+
```
19
+
20
+
Now `store.getters.total` function can be used in a Vue component similarly to state properties:
21
+
22
+
```js
23
+
exportdefault {
24
+
computed: {
25
+
total:store.getters.total
26
+
}
27
+
}
28
+
```
29
+
30
+
### Getters in a Separated File
31
+
3
32
It's possible that multiple components will need the same computed property based on Vuex state. Since computed getters are just functions, you can split them out into a separate file so that they can be shared in any component via the store:
0 commit comments