从VUEX存储中的阵列中抓取一项

import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);

// 创建一个新的Vuex存储实例
const store = new Vuex.Store({
  state: {
    items: ['item1', 'item2', 'item3'] // 假设存储中有一个名为items的数组
  },
  mutations: {
    // 定义一个mutation来修改存储中的数组
    updateItem(state, payload) {
      state.items = payload;
    }
  },
  actions: {
    // 定义一个action来触发mutation
    fetchItem({ commit, state }, index) {
      // 从存储中获取指定索引的项
      const item = state.items[index];
      
      // 提交mutation来更新存储中的数据
      commit('updateItem', item);
    }
  }
});

// 创建Vue实例，并将store传递给它
new Vue({
  store,
  // ...
}).$mount('#app');

<template>
  <div>
    <p>存储中的项：{{ item }}</p>
    <button @click="fetchItem">获取项</button>
  </div>
</template>

<script>
export default {
  computed: {
    item() {
      return this.$store.state.items[0]; // 获取存储中的第一项
    }
  },
  methods: {
    fetchItem() {
      this.$store.dispatch('fetchItem', 0); // 触发action来获取存储中的项
    }
  }
};
</script>