RxJs：在导航离开时取消订阅 Observables 是一种好习惯吗？答案

【问题标题】：RxJs: is it good practice to unsubscribe from Observables when navigating away?RxJs：在导航离开时取消订阅 Observables 是一种好习惯吗？
【发布时间】：2017-02-22 11:08:31
【问题描述】：

我只是进入一般的 RxJs 和 Observables。我掌握了一个想法，即您通常可以通过使用“takeUntil()”来创建“自包含”的 Observable。

在一门在线课程中，我看到老师说“我在 10 年内没有退订任何东西，因为我总是使用 takeUntil() 来创建结束的事件流”。这是他的例子：

var getElementDrags = elmt => elmt
    .mouseDowns.map(() => document.mouseMoves.takeUntil(document.mouseUps))
    .concatAll();

这对于“内部” Observables 来说非常好。但是“mousedown”上的一个外部 Observable 永远不会真正取消订阅......

我们还需要退订吗？用户离开页面时取消订阅/处置仍然是一种好习惯吗？

【问题讨论】：

在你的代码中你没有订阅任何东西，所以没有什么可以退订的。
@torazaburo：代码有点“伪”——但我认为有订阅可以获取“elmt.mouseDowns”Observable...

标签： rxjs unsubscribe

【解决方案1】：

例如你有 - 你没有订阅任何东西...... RxJS 是懒惰的，只有当你订阅结果 observable 时它才会订阅 mouseDowns，当然 - 当你订阅时，它会取消订阅下划线的 observables将取消订阅结果 observable。

但是，通常 - 是的，当你订阅某些东西时取消订阅是一个好习惯......但是 - 在使用 RxJS 时，通常你不需要手动订阅，当你需要时 - 很可能你需要订阅，而应用程序正在运行（因此无需取消订阅）。

唯一的例外是 - 当你正在开发自己的操作符，或者连接到外部的东西时……

例如，如果您有反应组件并使用生命周期飞节来订阅挂载时的更新，并在取消挂载时取消订阅。

这是我的库https://github.com/zxbodya/rx-react-container - 它将可观察对象、主题和反应组件组合成带有可渲染项目的新可观察对象......

const app$ = createContainer(
  App, // react component
  {totalCount$}, // observables with data
  {plusOne$, minusOne$} // observers for user actions
);

const appElement = document.getElementById('app');
const appSubscription = app$.forEach(renderApp=>render(renderApp(), appElement));

因此，您只有一个订阅可以管理整个应用程序 (appSubscription)，无需取消订阅 - 因为它是在应用程序运行时使用的。

同样的事情，关于导航时的路由和取消订阅 - 在简化的情况下，您将只有 flatMapLatest over observable 与当前位置，这将返回每个位置的 observable（如上面的 app$）......你再次这样做无需手动订阅/取消订阅 - flatMapLatest 将在内部完成。

【讨论】：