在 Vue3/Vue-test-utils 中测试 Vuex 减速器/突变

Question

我正在迁移到 Vue3，所以请原谅我不只使用 Pinia。我有一个这样的减速机：

export const mutations: MutationTree<UiState> = {
  SET_LOADING: (state, loading) => {
    Object.assign(state, loading); // before Vue3 this was Vue.set(...) for reactivity
  },
};

还有这样的测试

it('should set consultationLoading', () => {
  const state = uiState();
  const loading = true;
  const { SET_LOADING } = mutations;
  SET_LOADING(state, loading);
  expect(state.loading).toBe(loading);
});

由于我无法再使用 Vue.set() （来自

import Vue from 'vue';

），所以我只是按照另一篇文章中的建议使用 Object.assign 。但测试中状态并未更新。

Answer 1

Vue.set

的目的是触发更新，由于Vue 2的限制，它通常无法通过分配工作，这在Vue 3中不再是问题。

这是 JavaScript，而不是反应性问题。目前它是

Object.assign(obj, bool)

，什么也不做。

应该是：

Object.assign(state, { loading: true })

等同于：

state.loading = true