将 vuex 存储的一部分作为操作的有效负载分派是否正确？

Question

我对这家vuex 商店有一些疑问

export default {
    state: {
        resultSet: [
            {
                name: "result 1"
                deep: {
                    inside: {
                        isLoading: false
                    }
                }
            },
            {
                name: "result 2"
                deep: {
                    inside: {
                        isLoading: false
                    }
                }
            },
        ]
    },
    actions: {
        /*
        r is an item of the resultSet in the store (so r is a part of the store)
        */
        sendQuery(context, r) {
            //Here I mutate r directly (it means that I mutated the store directly without commit a mutation)

            r.deep.inside.isLoading = true;

            //Everything work, the UI is updated along with the state changes, but I'm not sure that 
            //I'm doing the right thing (mutate the store indirectly without committing a mutation)
        }
    }
}

问题：

1. 将存储的一部分作为操作的有效负载分派是否正确？ => 该动作可能会直接改变 r 的状态。

2. 在上述动作中修改r.deep.inside.isLoading=true是否正确？

Answer 1

1. 将存储的一部分作为操作的有效负载分派是否正确？ => 这个动作可能会直接改变 r 的状态。

状态在有效载荷中很好。但是动作不能直接修改状态。

1. 在上述操作中对r.deep.inside.isLoading=true进行变异是否正确？

没有。来自docs：

动作不是改变状态，而是提交突变。

操作应该只提交 突变（有点像 Vuex 中的“事件总线”和/或互斥锁）。

动作（类似于事件本身）调度其他类似事件的东西可能看起来很愚蠢，但是突变事件（“提交”）有特殊的规则，比如they must be synchronous，而动作之前可以执行异步任务提交突变。

在您开发时利用strict mode，这样当您错误地修改状态时，Vuex 肯定会通知您。