vuex中怎么用getters

在Vuex中，getters用于从state中派生出一些新的状态。可以将它们视为store的计算属性。使用getters可以避免在模板中编写重复或冗余的计算逻辑，同时也可以更好地组织和管理状态和逻辑。

要使用getters，需要在store中定义一个getters对象。该对象包含一些函数，这些函数接收store的state作为其第一个参数，并返回基于该state的派生状态。例如：

const store = new Vuex.Store({
  state: {
    todos: [
      { id: 1, text: 'Learn Vue', done: true },
      { id: 2, text: 'Build an app', done: false },
      { id: 3, text: 'Deploy to production', done: false }
    ]
  },
  getters: {
    doneTodos: state => {
      return state.todos.filter(todo => todo.done)
    }
  }
})

在这个例子中，我们定义了一个名为"doneTodos"的getter函数。它基于state中的"todos"数组，返回一个新的数组，其中只包含已完成的todo项。

在组件中，可以通过使用"mapGetters"辅助函数将getter映射到组件的计算属性中。例如：

import { mapGetters } from 'vuex'

export default {
  computed: {
    ...mapGetters([
      'doneTodos'
    ])
  }
}

这样，我们就可以在组件中使用"doneTodos"计算属性，来获取已完成的todo项列表。

总结一下，使用getters可以使我们更好地组织和管理Vuex中的状态和逻辑，同时可以提高代码的复用性和可维护性。