crimx/observable-hooks

使用useObservableEagerState时,组件更新时,导致无限渲染

se7en00 opened this issue · 2 comments

我在使用useObservableEagerState时,组件更新时,useObservableEagerState会去unsubscribe当前的subject,
unsubscribe当前的subject,应该在发生组件销毁时吧!

这是导致无限循环渲染的例子:
https://codesandbox.io/s/pedantic-moore-vtn5f?file=/src/ActionsMenu.tsx:973-996
第一次点击时没有问题,在切换时会发生无限循环渲染

crimx commented
useObservableEagerState(
    actions$.pipe(
       ...
    )
  );

这个写法是不被推崇的。React 的函数组件会在更新的时候被执行,这么写会不断生成新的 Observable。应该用 useContant 或 useObservable 包起来。(另外你的 actionsFn 也是会不断生成新的)

useObservableEagerState(
    useObservable(
       actions$.pipe(
          ...
       )
    )
  );

或者直接把 action$ 的 pipeline 移到你上面的 useContant 中。

thanks
忽略了自定义hook参数对象,也要保持参数对象的引用不变