8000 update todomvc example · vuejs/v2.vuejs.org@3714fd4 · GitHub
[go: up one dir, main page]
Skip to content

Commit 3714fd4

Browse files
yyx990803yyx990803
committed
update todomvc example
1 parent 7ee4d92 commit 3714fd4

File tree

5 files changed

+22
-37
lines changed

5 files changed

+22
-37
lines changed

‎examples/counter-hot/vuex/store.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import Vue from 'vue'
2-
import Vuex from '../../../src'
2+
import Vuex from 'vuex'
33
import * as getters from './getters'
44
import * as actions from './actions'
55
import * as mutations from './mutations'

‎examples/todomvc/components/App.vue

Lines changed: 12 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
autofocus
1010
autocomplete="off"
1111
placeholder="What needs to be done?"
12-
@keyup.enter="tryAddTodo">
12+
@keyup.enter="addTodo">
1313
</header>
1414
<!-- main section -->
1515
<section class="main" v-show="todos.length">
@@ -46,12 +46,8 @@
4646
</template>
4747

4848
<script>
49+
import { mapActions } from 'vuex'
4950
import Todo from './Todo.vue'
50-
import {
51-
addTodo,
52-
toggleAll,
53-
clearCompleted
54-
} from '../vuex/actions'
5551
5652
const filters = {
5753
all: todos => todos,
@@ -61,23 +57,16 @@ const filters = {
6157
6258
export default {
6359
components: { Todo },
64-
vuex: {
65-
getters: {
66-
todos: state => state.todos
67-
},
68-
actions: {
69-
addTodo,
70-
toggleAll,
71-
clearCompleted
72-
}
73-
},
7460
data () {
7561
return {
7662
visibility: 'all',
7763
filters: filters
7864
}
7965
},
8066
computed: {
67+
todos () {
68+
return this.$store.state.todos
69+
},
8170
allChecked () {
8271
return this.todos.every(todo => todo.done)
8372
},
@@ -89,13 +78,17 @@ export default {
8978
}
9079
},
9180
methods: {
92-
tryAddTodo (e) {
81+
addTodo (e) {
9382
var text = e.target.value
9483
if (text.trim()) {
95-
this.addTodo(text)
84+
this.$store.call('addTodo', text)
9685
}
9786
e.target.value = ''
98-
}
87+
},
88+
...mapActions([
89+
'toggleAll',
90+
'clearCompleted'
91+
])
9992
},
10093
filters: {
10194
pluralize: (n, w) => n === 1 ? w : (w + 's'),

‎examples/todomvc/components/Todo.vue

Lines changed: 5 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -19,21 +19,8 @@
1919
</template>
2020

2121
<script>
22-
import {
23-
toggleTodo,
24-
deleteTodo,
25-
editTodo
26-
} from '../vuex/actions'
27-
2822
export default {
2923
props: ['todo'],
30-
vuex: {
31-
actions: {
32-
toggleTodo,
33-
deleteTodo,
34-
editTodo
35-
}
36-
},
3724
data () {
3825
return {
3926
editing: false
@@ -49,12 +36,15 @@ export default {
4936
}
5037
},
5138
methods: {
39+
toggleTodo (todo) {
40+
this.$store.call('toggleTodo', todo)
41+
},
5242
doneEdit (e) {
5343
const value = e.target.value.trim()
5444
if (!value) {
55-
this.deleteTodo(this.todo)
45+
this.$store.call('deleteTodo', this.todo)
5646
} else if (this.editing) {
57-
this.editTodo(this.todo, value)
47+
this.$store.call('editTodo', this.todo, value)
5848
this.editing = false
5949
}
6050
},

‎examples/todomvc/vuex/plugins.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { STORAGE_KEY } from './store'
22
import createLogger from '../../../src/plugins/logger'
33

44
const localStoragePlugin = store => {
5-
store.on('mutation', (mutation, { todos }) => {
5+
store.subscribe((mutation, { todos }) => {
66
localStorage.setItem(STORAGE_KEY, JSON.stringify(todos))
77
})
88
}

‎examples/todomvc/vuex/store.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import Vue from 'vue'
2-
import Vuex from '../../../src'
2+
import Vuex from 'vuex'
33
import plugins from './plugins'
4+
import * as actions from './actions'
45

56
Vue.use(Vuex)
67

@@ -48,6 +49,7 @@ const mutations = {
4849

4950
export default new Vuex.Store({
5051
state,
52+
actions,
5153
mutations,
5254
plugins
5355
})

0 commit comments

Comments
 (0)
0