我是否应该重构我的项目以使用NGRX？

Question

我正在开发一个企业前端，它有点像保险的CRM。这是我的第一个大角度项目，这就是为什么我还没有使用NGRX到现在为止。相反，我为每一页做了一个StateService，比如合同列表，合同细节，.用状态对象和行为主体使状态发生反应。但是现在我必须在每个组件中订阅、取消订阅和实现一个updateState函数，这个组件使用这个服务。

我想这将是一个长远的反模式，可能是时候投资于NGRX了。你能不能告诉我你的两分钱，以及你将如何处理国家管理？请记住，我的时间有点短，因为第一次发布的截止日期是两个月。

对不起，我知道这是个固执己见的问题，但我希望能得到一些不同的国家管理方式。

Answer 1

您没有为您的解决方案包含任何特定的代码，但是您可以使用一个简单的select / modify函数来模拟redux模式。

@Injectable({ providedIn: 'root' })
export class StateService {
  state: StateModel;
  stateSubject$: BehaviorSubject<any>;

  constructor() {
    this.setInitialState();
    this.stateSubject$ = new BehaviorSubject<any>(this.state);
  }

  select(propPath: keyof StateModel | '' = ''): Observable<any> {
    let observable: Observable<any> = this.stateSubject$.asObservable();
    if (propPath.length > 0) {
      propPath.split('.').forEach((prop) => {
        observable = observable.pipe(map((state) => state[prop]));
      });
    }
    return observable;
  }

  modify(modFn: (state: StateModel) => Partial<StateModel>) {
    this.state = { ...this.state, ...modFn(this.state) };
    this.stateSubject$.next(this.state);
  }

  setInitialState() {
    this.state = {
      someProp: { a: 10, b: 20 },
      somethingElse: 'Hello world',
    };
  }
}

使用

    // some.component
    // select a value from your state
    this.somethingElse = state.select('somethingElse');
    this.a = state.select('someProp.a');
    // modify the state
    state.modify((state) => ({ somethingElse: 'Foobar' }));
    state.modify((state) => ({ someProp: { a: 310, b: state.someProp.b } }));

您不必重新实现任何逻辑，因为状态修改只是一个回调函数，它返回覆盖当前状态对象的状态模型的一个部分对象。

这种方法类似于Redux模式，但却消除了稳定库的所有样板和“安全性”。