如何使用observable和computeds创建mobx类的深层副本？

Question

我想创建一个具有mobx可观察和计算属性的对象的深层副本。

目标是为本地编辑创建可以提交或丢弃的复制项。

我发现了这种行为的一个例子，但它来自mobx-state-tree：

如何在mobx中实现相同的行为？

Answer 1

您可以使用mobx-utils包中的createViewModel。

示例

class Todo {
  @observable firstName = "Foo";
  @observable lastName = "Bar";
  @computed get fullName() {
    return `${this.firstName} ${this.lastName}`;
  }
}

const todo = new Todo();
const todoCopy = createViewModel(todo);

todoCopy.firstName = "Baz";

// ...

// Submit the changes to the original todo
todoCopy.submit();