應該優先通過?[Vuex](https://github.com/vuejs/vuex)?管理全局狀態，而不是通過?`this.$root`?或一個全局事件總線。 通過?`this.$root`?和/或[全局事件總線](https://cn.vuejs.org/v2/guide/migration.html#dispatch-和-broadcast-替換)管理狀態在很多簡單的情況下都是很方便的，但是并不適用于絕大多數的應用。Vuex 提供的不僅是一個管理狀態的中心區域，還是組織、追蹤和調試狀態變更的好工具。 ~~~ //反例 // main.js new Vue({ data: { todos: [] }, created: function () { this.$on('remove-todo', this.removeTodo) }, methods: { removeTodo: function (todo) { var todoIdToRemove = todo.id this.todos = this.todos.filter(function (todo) { return todo.id !== todoIdToRemove }) } } }) ~~~ ~~~ //好例子 // store/modules/todos.js export default { state: { list: [] }, mutations: { REMOVE_TODO (state, todoId) { state.list = state.list.filter(todo => todo.id !== todoId) } }, actions: { removeTodo ({ commit, state }, todo) { commit('REMOVE_TODO', todo.id) } } } <!-- TodoItem.vue --> <template> <span> {{ todo.text }} <button @click="removeTodo(todo)"> X </button> </span> </template> <script> import { mapActions } from 'vuex' export default { props: { todo: { type: Object, required: true } }, methods: mapActions(['removeTodo']) } </script> ~~~