Question

我是Vuejs Vuex的第一个应用程序。我找不到过滤州的最佳方法。

存储/ index.js

 state: {
  projects: []
 },
 mutations: {
   SET_PROJECT_LIST: (state, { list }) => {
     state.projects = list
   }  
 },
 actions: {
   LOAD_PROJECT_LIST: function ({ commit }) {
    axios.get('projects').then((response) => {
      commit('SET_PROJECT_LIST', { list: response.data})
     }, (err) => {
     console.log(err)
   })
  }
 }

在组件中：

computed: {
  ...mapState({
    projects
  })
}

此时我有一个项目清单。好！

现在我添加了按钮来过滤我的项目，例如：活动项目，类型项目......

如何操作我的项目对象（this.projects）？

另一个this.$store.dispatch

使用另一个getter功能

我在不改变状态的情况下操纵状态？

我有点困惑。

在Vuex中填充的列表上的过滤器的一些示例？

修改我一直在尝试：

this.$store.getters.activeProjects()

但我如何更新this.projects？

activeProjects(){
  this.projects = this.$store.getters.activeProjects() 
}

不起作用

Answer 1

我建议保持原始状态不变，并使用“getters”过滤其数据。

事实上，官方文档中包含了如何获得所有“完成”待办事项的示例。它可能对您有用：

  const store = new Vuex.Store({
  state: {
    todos: [
      { id: 1, text: '...', done: true },
      { id: 2, text: '...', done: false }
    ]
  },
  getters: {
    doneTodos: state => {
      return state.todos.filter(todo => todo.done)
    }
  }
})

吸气剂参考：https://vuex.vuejs.org/en/getters.html

祝你好运！

Vuex过滤器状态

1 个答案: