Showing
4 changed files
with
19 additions
and
7 deletions
| 1 | <template lang="html"> | 1 | <template lang="html"> |
| 2 | <div> | 2 | <div> |
| 3 | - count: {{ count }} | 3 | + count: {{ count }} <br /> |
| 4 | - countPlusLocalState: {{countPlusLocalState}} | 4 | + countAlias: {{ countAlias }} <br /> |
| 5 | + countPlusLocalState: {{countPlusLocalState}} <br /> | ||
| 6 | + localComputed: {{localComputed}} | ||
| 5 | </div> | 7 | </div> |
| 6 | </template> | 8 | </template> |
| 7 | 9 | ||
| ... | @@ -16,16 +18,21 @@ export default { | ... | @@ -16,16 +18,21 @@ export default { |
| 16 | localCount: 10 | 18 | localCount: 10 |
| 17 | } | 19 | } |
| 18 | }, | 20 | }, |
| 19 | - computed: mapState({ | 21 | + computed: { |
| 22 | + localComputed() { | ||
| 23 | + return 'localComputed' | ||
| 24 | + }, | ||
| 25 | + ...mapState({ | ||
| 20 | // 箭头函数可以让代码非常简洁 | 26 | // 箭头函数可以让代码非常简洁 |
| 21 | count: state => state.count, | 27 | count: state => state.count, |
| 22 | // 传入字符串 'count' 等同于 `state => state.count` | 28 | // 传入字符串 'count' 等同于 `state => state.count` |
| 23 | countAlias: 'count', | 29 | countAlias: 'count', |
| 24 | // 想访问局部状态,就必须借助于一个普通函数,函数中使用 `this` 获取局部状态 | 30 | // 想访问局部状态,就必须借助于一个普通函数,函数中使用 `this` 获取局部状态 |
| 25 | - countPlusLocalState (state) { | 31 | + countPlusLocalState(state) { |
| 26 | return state.count + this.localCount | 32 | return state.count + this.localCount |
| 27 | } | 33 | } |
| 28 | - }), | 34 | + }) |
| 35 | + }, | ||
| 29 | mounted() {}, | 36 | mounted() {}, |
| 30 | methods: {}, | 37 | methods: {}, |
| 31 | components: {} | 38 | components: {} | ... | ... |
| 1 | import Vue from 'vue' | 1 | import Vue from 'vue' |
| 2 | import Vuex from 'vuex' | 2 | import Vuex from 'vuex' |
| 3 | +import * as types from './types' | ||
| 3 | 4 | ||
| 4 | Vue.use(Vuex) | 5 | Vue.use(Vuex) |
| 5 | 6 | ||
| ... | @@ -40,7 +41,7 @@ const store = new Vuex.Store({ | ... | @@ -40,7 +41,7 @@ const store = new Vuex.Store({ |
| 40 | } | 41 | } |
| 41 | }, | 42 | }, |
| 42 | getters: { | 43 | getters: { |
| 43 | - doneTodos: state => { | 44 | + [types.DONE_TODOS](state) { |
| 44 | return state.todos.filter(todo => todo.done) | 45 | return state.todos.filter(todo => todo.done) |
| 45 | }, | 46 | }, |
| 46 | doneTodosCount: (state, getters) => { | 47 | doneTodosCount: (state, getters) => { | ... | ... |
src/types.js
0 → 100644
-
Please register or login to post a comment