Vuex mutation 写对了吗?

问题描述 投票:0回答:1

不知mutation方法是否写对了,是否可以修改初始状态数组?我不确定最后几行变异方法是否写得好。我没有错过任何东西吗?

// Store 

state: {
  flights: [
    {trip_class: 0, number_of_change="1"},
    {trip_class: 1, number_of_change="2"},
    {trip_class: 1, number_of_change="1"}...
  ]
}           // expecting to filter the array

mutations: {
  setFilteredFlights: (state, data) => {
      // flight classes
      if (...) {
        state.flights.filter(
          (flight) =>
            flight.trip_class === data.selectedFlightClass ||
            flight.number_of_changes === data.selectedChanges
        );
      }
      //flight changes
      else if (...) {
        state.flights;                             // not sure about this line of code
      }
    },
}

javascript vue.js state vuex store
1个回答
0
投票

flights
是保存航班对象的主数组。只使用一个 getter(或几个 getter)来获取过滤后的数据会容易得多,而不必改变状态。

getters: {
  getFlightsByTripClass: (state) => (tripClass) => {
    return state.flights.filter(flight => flight.trip_class === tripClass);
  }
}

要在你的 Vue 组件中使用这个 getter,你可以使用

this.$store.getters
:

computed: {
  filteredFlights() {
    return this.$store.getters.getFlightsByTripClass(1);
  }
}

此外,为了更好地衡量,请确保遵循变量的驼峰式大小写约定。使用

numberOfChange
,而不是
number_of_change

© www.soinside.com 2019 - 2024. All rights reserved.