Question

我无法获得将数据传递到应用状态的突变或动作。尽管花了几个小时阅读Vuex文档，但我什至不确定我是否可以正确地打电话给他们。

我开始创建一个突变，以在触发@click事件时简单地更新我的状态，但是当它不起作用时，我尝试了一个操作并得到了相同的结果：什么都没有。

我如何调用操作的示例：

<div v-for="(data, index) in dataList" :key="index">
  <div @click="updateDataSomewhereElse(data)">  // action called here
    // do some other stuff
  </div>
</div>

我如何从单文件组件中分派动作的示例：

// some code
methods: {
  updateDataSomewhereElse: function(data) {
    this.$store.dispatch('setData', data); // action dispatched here
  }
}

我的动作和突变示例：

// state code
mutations: {
  updateStateData(state, data) {
    state.data = data;
  }
},
actions: {
  setData({commit}, data) {
    commit('updateStateData', data);
  }
}

不用说，我希望当我的动作被调用时，状态会随着我的突变而更新，但是我什么也没得到。

我做错了什么？

编辑-更多详细信息：

我的初始状态示例：

state: {
  data: 'something'
}

从我的main.js中：

import Vue from 'vue';
import App from './App.vue';
import router from './router';
import store from './store';

new Vue({
  router,
  store,
  render: h => h(App),
}).$mount('#app');

我知道它不会在Vue devtools中返回任何内容，因为它仅显示我的初始状态，并且无法从此处进行手动提交/调度。另外，不会触发我的方法和操作中的console.log语句。我已经用Vue.use(Vuex);将store.js文件连接到Vue，所以这不是连接问题。

Answer 1

我只需执行以下操作即可解决此问题：

<div v-for="(data, index) in dataList" :key="index">
  <div>
    <span @click="updateDataSomewhereElse(data)">do some other stuff</span>
  </div>
</div>

我不确定这是为什么或如何解决，但是现在我要更新状态。

无法获得Vuex突变或采取行动将数据传递给状态

1 个答案: