vuex模块化调用commit
时间: 2023-08-27 10:09:55 浏览: 108
在使用Vuex进行模块化调用时,可以使用`commit`方法来触发一个mutation。下面是一个示例:
假设你有一个名为`user`的模块,其中包含了一个mutation名为`SET_USERNAME`:
```javascript
// user模块
const state = {
username: ''
};
const mutations = {
SET_USERNAME(state, username) {
state.username = username;
}
};
const actions = {
setUsername({ commit }, username) {
commit('SET_USERNAME', username);
}
};
export default {
state,
mutations,
actions
};
```
然后在你的组件中,你可以通过`this.$store.commit`来调用这个mutation:
```javascript
// 组件
import { mapActions } from 'vuex';
export default {
// ...
methods: {
...mapActions('user', ['setUsername']),
updateUsername(newUsername) {
this.setUsername(newUsername);
}
}
};
```
在上面的例子中,我们使用`mapActions`辅助函数将`setUsername`映射到组件的方法中。然后我们可以在`updateUsername`方法中调用`this.setUsername`来触发`SET_USERNAME` mutation。
这样,当你调用`updateUsername`方法时,会触发`SET_USERNAME` mutation,从而更新`user`模块中的`username`状态。
阅读全文