Hooke

no message

<template lang="html">
<div>
count: {{ count }}
countPlusLocalState: {{countPlusLocalState}}
count: {{ count }} <br />
countAlias: {{ countAlias }} <br />
countPlusLocalState: {{countPlusLocalState}} <br />
localComputed: {{localComputed}}
</div>
</template>
......@@ -16,16 +18,21 @@ export default {
localCount: 10
}
},
computed: mapState({
computed: {
localComputed() {
return 'localComputed'
},
...mapState({
// 箭头函数可以让代码非常简洁
count: state => state.count,
// 传入字符串 'count' 等同于 `state => state.count`
countAlias: 'count',
// 想访问局部状态,就必须借助于一个普通函数,函数中使用 `this` 获取局部状态
countPlusLocalState (state) {
countPlusLocalState(state) {
return state.count + this.localCount
}
}),
})
},
mounted() {},
methods: {},
components: {}
......
<template lang="html">
<div>
doneTodos: {{doneTodos}}
doneTodos: {{doneTodos}} <br />
doneTodosCount: {{doneTodosCount}}
</div>
</template>
......
import Vue from 'vue'
import Vuex from 'vuex'
import * as types from './types'
Vue.use(Vuex)
......@@ -40,7 +41,7 @@ const store = new Vuex.Store({
}
},
getters: {
doneTodos: state => {
[types.DONE_TODOS](state) {
return state.todos.filter(todo => todo.done)
},
doneTodosCount: (state, getters) => {
......
export const DONE_COUNT = 'todos/DONE_COUNT'
export const FETCH_ALL = 'todos/FETCH_ALL'
export const TOGGLE_DONE = 'todos/TOGGLE_DONE'
export const DONE_TODOS = 'doneTodos'