vuex相关：如果数据从服务器获取，并且经过运算才进入state，应该怎么写？

Question

如果从服务器获取了一个list，然后这个list又经过了本地js的加工，才成为能用的新list，然后我想赋值给vuex的state，应该怎么写？

是在App.vue的onLaunch写运算过程，然后赋值给state？

还是在index.vue里写？

还是写在mutations里？

Answer 1

1. 先定义一个state叫list吧.
2. mutations里写一个mutation, 比如方法名为setApplist, 函数内给list赋值
3. 组件内通过this.$store.$commit('setApplist', data)把data传给state上的list

具体放在index.vue还是app.vue的看你自己的业务需求才进行划分, 思路就是这样, 并不复杂哦

Answer 2

我想可以用计算属性，代码如下:

computed:{
    list(){
        let setData = data;//data就是处理过后的数据
        this.$store.state.setData = setData;
        return setData;
    }
}

也可以用监听。这是一种直接设置的办法，当然也可以用mutations，例如这么定义一个函数:

addImgList(state, userList) {
    state.imgList = userList
},

在你的组件中，你可以先引入:

...mapMutations(['addImgList']);

在某个事件或者方法内去调用:

//参数就是你新处理后的数据
this.addImgList(newData);

当然或许还有其他方式。

Answer 3

感觉action好点，再action里面处理完异步数据之后再commit,防止后面还有本地不需要特殊处理的数据操作commit到状态里