English
资源说明：Super-Vuex 使用体验详解
Super-Vuex 是一种用于简化 Vuex 的数据架构解决方案。Vuex 是一个常用的状态管理工具，但是在实际应用中存在一些问题，如数据共享、业务接口分离、数据模块化管理等。Super-Vuex 正是为了解决这些问题而生的。
一、状态模块化
在 Vuex 中，我们通常使用单一状态树来管理应用的所有状态。但是，当应用变得非常复杂时，store 对象就有可能变得相当臃肿。Super-Vuex 提供了一种简单的解决方案，即使用 ChildVuex 来将状态模块化。
例如，在 Vuex 中，我们可能会这样定义模块：
```javascript
const moduleA = {
state: { ... },
mutations: { ... },
actions: { ... },
getters: { ... }
}
const moduleB = {
state: { ... },
mutations: { ... },
actions: { ... }
}
const store = new Vuex.Store({
modules: {
a: moduleA,
b: moduleB
}
})
store.state.a // -> moduleA 的状态
store.state.b // -> moduleB 的状态
```
而在 Super-Vuex 中，我们可以使用 ChildVuex 来定义模块：
```javascript
import { ChildVuex } from "super-vuex";
const child = new ChildVuex('...');
child.value = { ... };
child.setCommit = {...};
const Main = new SuperVuex();
Main.setModule(child);
export default Main.init();
```
二、操作方法
Super-Vuex 的操作方法上告别了以往同步数组操作的繁杂过程。在 Vuex 中，我们通常需要在 mutation 中定义方法操作，然后在 action 中 commit 或是在组件中 commit。Super-Vuex 提供了一系列基础的数组操作方法，让你操作数组非常简单。
例如，在 Vuex 中，我们可能会这样实现一个对数组的操作：
```javascript
mutations: {
// push
increment(state, n) {
state.arr = [...state.arr, n]
},
// pop
popArr(state) {
state.arr.pop()
},
// shift
shiftArr(state) {
state.arr.shift()
},
// unshift
unshift(state) {
state.arr.unshift('students', {
name: 'huaping1',
age: 30
})
},
// deleteStudent
deleteStudent(state) {
state.arr.splice('students', 0, 1);
},
}
```
而在 Super-Vuex 中，我们可以使用提供的操作 API，提高了数据传递的效率：
```javascript
child.setCommit('increment', (state, n) => {
state.count += n;
});
changeName() {
this.$store.user.commit('name', 'someone');
}
```
Super-Vuex 是一种功能强大且易用的状态管理解决方案，它可以帮助我们简化 Vuex 的数据架构，并提供了一系列基础的数组操作方法。
本源码包内暂不包含可直接显示的源代码文件，请下载源码包。
