如何在vuex中定义状态变量

Question

<v-select
          v-model="filterSystem"
          :items="currentSystems"
          :menu-props="{ maxHeight: '400' }"

          class="pa-0 ma-0"
          multiple
          outline
          dense

          persistent-hint
        />


 computed:{
dateRanges() {
  return [
    { text: i18n.t('Latest'), range: [null, null] },
    { text: i18n.t('Hour'), range: [-3600, null] },
    { text: i18n.t('SevenHours'), range: [-3600 * 6, null] },
    { text: i18n.t('TwentyHours'), range: [-3600 * 12, null] },
    { divider: true },
    { text: i18n.t('SelectRange'), range: [0, 0] },
  ]
 },
isDark() {
  return this.$store.getters.getPreference('isDark')
},
 history() {
  return this.item.history.map((h, index) => ({ index: index, ...h }))
},
 currentSystems() {
  return this.$store.getters['alarms/systems']
},
filterSystem: {
  get() {
    return this.$store.state.alarm.filter.system
  },
  set(value) {
    this.$store.dispatch('alarms/setFilter', {
      system: value.length > 0 ? value : null
    }).then(() => this.$store.dispatch('alarms/getAlamrs'))
  }
 },

}

我的板条箱系统[]在getters action和mutation中处于状态和方法…但无法在v-select组件中获取数据。我更新了一些计算属性…我观看了一些教程…在教程中，他们只使用方法或仅使用方法

Answer 1

您是否尝试过使用mapState并像那样从存储访问系统值？ 你可以在这个链接上找到一个例子：https://vuex.vuejs.org/guide/state.html

将其添加到组件中：

import { mapState } from 'vuex'

computed: {
           ...mapState('alarms', ['systems'])
        },

然后，您的v-select应该如下所示：

        <v-select
          v-model="filterSystem"
          :items="systems"
          :menu-props="{ maxHeight: '400' }"
          class="pa-0 ma-0"
          multiple
          outline
          dense
          persistent-hint
        />