如何从 NGXS 商店获取以前的状态

Question

在 NGXS 中，我们有 getState() 来获取当前状态。有没有办法从商店获取以前的状态？我正在寻找解决方案，因为我必须实现 Undo/Redo 种功能。谢谢！

Answer 1

默认情况下无法获取以前的状态，但您绝对可以创建一个服务来监视状态并将副本推送到自己的堆栈中。然后，您可以在商店中使用 reset 方法恢复此状态。

您可能会使用 store 的 select 和 reset 方法。有关详细信息，请参阅此处：https://ngxs.gitbook.io/ngxs/concepts/store#selecting-state

Answer 2

@Mark Whitfield 是正确的，没有直接的方法可以使用 NGXS 获取先前的状态。使用 NGXS 我有一个用例，我想知道以前的值来执行撤消式操作。

我使用常规的 NGXS @Selector 语法进入我感兴趣的状态切片，然后我直接订阅了那个 Observable 并使用 rxjs pairwise 运算符来给我新的发射值和以前的值。非常适合我想要使用这些值的方式，因此它可能适合您的需求。

Answer 3

您可以使用 store.snapshot() 方法获取特定时间的商店快照。您可以将快照存储在变量中，然后在重新滚动的情况下，只需对快照使用 store.reset()。

export class MyComponent {

  private initialSnapshot: MyStoreStateModel;

  constructor(private store: Store){
    this.initialSnapshot = store.snapshot();
  }

  // ... component logic / state modification logic

  rollback = () => this.store.reset(this.initialSnapshot); 
}

根据您的需要进行调整...

希望对您有所帮助 :-)

Answer 4

您可以使用 npm 中的 "redux-undo" 来实现撤消和重做。它非常简单直接。您可以找到文档 here

如何从 NGXS 商店获取以前的状态

How to get previous state from NGXS store

ngxs

ngx-share