带有ngrx /效果的无限循环

Question

我正在努力了解ngrx /效果.我已经构建了一个简单的函数,每次单击都会将数字增加1.但点击时它会进入无限循环,不确定是什么时候发生的.我确定我犯了一些愚蠢的错误.

monitor.effects.ts

@Injectable()
export class MonitorEffects {
    @Effect()
    compute$: Observable<Action> = this.actions$
        .ofType(monitor.ActionTypes.INCREMENT)
        .map((action: monitor.IncrementAction) => action.payload)
        .switchMap(payload => {
            return this.http.get('https://jsonplaceholder.typicode.com/users')
             .map(data => new monitor.IncrementAction(payload+1))
             .catch(err => of(new monitor.InitialAction(0)))
        });

    constructor(private actions$: Actions, private http:Http ) {};
}

monitor.component.ts

ngOnInit() {
    this.storeSubsciber = this
      .store
      .select('monitor')
      .subscribe((data: IMonitor.State) => {
        this.value = data.value;
        this.errorMsg = data.error;
        this.currentState = data.currentState;
      });
  }

  increment(value: number) {
    this.store.dispatch(new monitorActions.IncrementAction(value));
  }

monitor.reducer.ts

export const monitorReducer: ActionReducer<IMonitor.State> = (state = initialState, action: Actions) => {
  switch (action.type) {
    case ActionTypes.INCREMENT:
      return Object.assign({}, { value: action.payload, currentState: ActionTypes.INCREMENT, error: null });
...
...
...

    default:
      return Object.assign({}, { value: 0, currentState: ActionTypes.INITIAL, error: null });
  }
}

Answer 1

一个Effect可以让你看一个给定的动作类型,并作出反应的行动每次它已经出动时间.

因此,如果您在某些效果中观察动作X并从该效果中调出另一个动作X,您将最终处于无限循环中.

在你的情况下:你的动作是类型的,.ofType(monitor.ActionTypes.INCREMENT)然后从你的效果你发出一个动作monitor.ActionTypes.INCREMENT(从这部分我假设:) monitor.IncrementAction(payload+1),然后再次触发效果,并再次,...

Answer 2

我遇到了同样的问题，答案是我的效果没有返回与当前效果键控的完全不同的动作。

对于我的影响，我只做了一个.do()，并没有将它切换到一个新的动作。那是我的问题。因为我不需要触发一个新的动作，所以我做了一个 NoopAction 来获得回报。这意味着任何人都不应该在减速器中使用 NoopAction。

Answer 3

我遇到了这个问题，这里的答案没有帮助。对我来说，我有一个“成功”的行动，需要tap()导航。我的浏览器会锁定，我不明白为什么，直到我将日志放入我的点击功能并注意到它被无限地点击。

tap我的问题是，当返回相同的可观察值时，效果正在调用自身。我错过了什么，我的解决方案......是施加dispatch: false我的效果以防止它自行调度。

@Effect({dispatch: false})