为什么需要取消订阅 Firebase 的 `onAuthStateChanged`？

Question

为什么需要取消订阅 Firebase 的 `onAuthStateChanged`？

4

我正在跟随一个关于创建Google登录的教程。他说你需要使用onAuthStateChanged来监听登录/退出。我没有理解的部分是他说这个方法就像“开放订阅”，我们需要“关闭订阅”以防止内存泄漏。

在查看代码之前，我无法理解的是：

为什么我们需要定义unsubscribeFromAuth；
为什么我们需要在ComponentDidMount中将onAuthStateChanged赋值给this.unsubscribeFromAuth；
为什么我们需要使用ComponentWillUnmount并调用unsubscribeFromAuth

class App extends React.Component {
  constructor() {
    super()

    this.state = {
      currentUser: null
    }
  }

  unsubscribeFromAuth = null

  componentDidMount() {
    this.unsubscribeFromAuth = auth.onAuthStateChanged(user => {
      this.setState({ currentUser: user })
      console.log(user)
    })
  }

  componentWillUnmount() {
    this.unsubscribeFromAuth()
  }

- Muhamad Hafiz

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Josh Pittman · Accepted Answer

您需要取消订阅以避免内存泄漏。

当您初始化 auth.onAuthStateChanged()时，您创建了一个监听器。如果您不取消订阅，则此监听器将继续监听，即使在停止使用它之后也是如此。这将浪费内存。

为了防止这种情况发生，您需要在卸载应用程序时取消订阅监听器。

为了取消订阅，您需要有东西可以取消订阅。这就是为什么您在 ComponentDidMount 中将监听器分配给变量的原因。这样，您可以在想要取消订阅时引用该变量。

希望这能解答您的三个问题。

以下是两个更详细地涵盖该主题的演讲：