ruby - Vuex 通过 slim (Ruby on rails) 获取数据

Question

如果我通过 Slim 接收数组，如何传输数据？

regions-list :region=@regions

regions-list- 我的组件 vue

:region- 带有项目的数组

@regions- 带有来自后端的项目的变量

我是新手vuex，我想，我需要这样的东西，但不知道如何用物品传达数组

标签： rubyvue.jsvuejs2vuexvue-router

Answer 1

这就是组织 Vuex 工作的方式

export default new Vuex.Store({
  state: {
    reactions: [],
  },
  mutations: {
    setReactions(state, segment) {
      state.reactions = segment;
    },
  },
  actions: {
    async loadReactions({ commit }) {
      try {
        const reactions = '... response/request';

        commit('setReactions', reactions); // Here we use mutation to put new data into state.
      } catch (e) {
        // ...
      }
    },
  },
});

在您的组件 vue 区域列表中

<template>
  <div>{{ reactions }}</div> <!-- Here you can display and look at the content -->
</template>

<script>
  import { mapState, mapActions } from 'vuex';

  export default {
    name: 'RegionsList',
    computed: {
      ...mapState(['reactions']), // This is get the state
    },
    created() {
      this.loadReactions(); // Here you perform a function that receives data and puts it in state
    },
    methods: {
      ...mapActions(['loadReactions']),
    },
  };
</script>

<style scoped></style>