vue store 添加数据
时间: 2023-10-26 18:05:30 浏览: 45
在 Vue 中,可以使用 Vuex 来管理应用的状态和数据。要添加数据到 Vuex 的 store 中,需要先定义一个 mutation,然后在组件中触发该 mutation 来改变 store 中的数据。
首先,在你的 Vuex store 文件(通常是一个名为 `store.js` 的文件)中定义一个 mutation。例如,你可以添加一个名为 `addData` 的 mutation,可以在其中改变 store 中的数据:
```javascript
// store.js
const state = {
data: []
};
const mutations = {
addData(state, newData) {
state.data.push(newData);
}
};
export default new Vuex.Store({
state,
mutations
});
```
然后,在你需要添加数据的组件中,可以通过调用 `commit` 方法来触发该 mutation:
```javascript
// YourComponent.vue
<script>
import { mapMutations } from 'vuex';
export default {
// ...
methods: {
...mapMutations(['addData']),
addNewData() {
const newData = { /* 新数据对象 */ };
this.addData(newData);
}
}
};
</script>
```
现在,当你调用 `addNewData` 方法时,它将会触发 `addData` mutation,并将新数据传递给该 mutation。该 mutation 将会将新数据添加到 store 的 `data` 数组中。
请注意,这只是 Vuex 的一种用法示例,你还可以根据你的具体需求进行调整和扩展。