1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
| <template>
| <div class="home">
| <h1>vuexDemo</h1>
| </div>
| </template>
|
| <script>
| import { mapState, mapGetters, mapMutations, mapActions } from "vuex";
|
| export default {
| computed: {
| // 模块名(嵌套层级要写清楚)例如:rlc
| // 获取state值
| ...mapState("rlc", {
| optionsMap: state => state.OPTIONSMAP
| }),
| // 通过getters获取值
| ...mapGetters("rlc", ["getOptionsMap"])
| },
| methods: {
| ...mapMutations("rlc", [
| "setOptionsMap" // 将 `this.setOptionsMap()` 映射为 `this.$store.commit('setOptionsMap')`
| ]),
| ...mapActions("rlc", [
| "getOptionsData" // 将 `this.setOptionsMap()` 映射为 `this.$store.dispatch('setOptionsMap')`
| ])
| },
| mounted() {
| console.log("optionsMap", this.optionsMap);
| console.log("getOptionsMap", this.getOptionsMap);
| console.log(this.setOptionsMap);
| console.log(this.getOptionsData);
| }
| };
| </script>
|
|