React 是否与 Vue.set() 等效？

Question

React 是否有等价于 Vue.set()（又名 this.$set）？它使 Vue 能够更新对象并向属性添加反应性（而不是替换整个对象）。

Answer 1

React 没有Vue 的反应性功能，也不会检测状态对象的深层变化。

React 仅依赖于状态不变性，即状态在更新后应该是一个新对象。

在 Vue 中：

Vue.set(vm.foo, 'bar', 1);

React 中的正确方法：

// just setState for useState hook
this.setState(state => ({
  ...state,
  foo: {
    ...state.foo,
    bar: 1
  }
}));

React 中的错误方式：

this.state.foo.bar = 1;
this.setState(this.state); // or this.forceUpdate();

这将更新组件，但在依赖不可变状态的子组件中可能无法按预期工作。这不适用于useState钩子，因为它依赖于不可变状态。

第三方库可用于使 React 状态的不变性更容易（Immer），甚至可以将其替换为可变状态（MobX）。MobX 的工作方式类似于 Vue 反应性（Vue 2 中的描述符 getter/setter，ProxyVue 3 中）。