vuex 重置清空所有数据（注意这里使用的Vuex4.x，3.x不可以这样实现重置数据）

在用户退出账户的时候，你可能需要初始化store里面的所有信息，这里提供了几种可用的方式。

1. 我们知道vuex和路由在刷新页面的时候都会重置，所以可以通过刷新网页的方式来实现vuex重置清空所有数据。但是这种方式对于用户而言，体验是在糟糕。
2. 另外一种则是在退出的时候，给所有的属性重新赋空值，但是这种方式是在太笨了，而且无法实现重复使用。
3. 第三种则是一种非常好的方式了，代码如下：

//创建一个和store一模一样的对象
const options = {
    //为了确保state的唯一性，所以这里使用函数return的方式来获取。这跟组件的data原理一样的。
    state() {
        return {}
    },
    actions: {},
    mutations: {},
    modules: {
        ...
    }
}
export const store = createStore({
    //通过展开运算符把上面创建的options赋值进来
    ...options,
    plugins: [
        ...
    ]
})
// 重置store
export function resetStore() {
    store.replaceState(createStore(options).state)
}

 

这里面使用到了store.replaceState()方法，切记不可以直接条用store.replaceState({}) ，因为直接把空对象作为参数传递进去会导致所有数据结构和响应性丢失