Question

我有一个本机应用程序，每当特定屏幕的状态变为“聚焦”时，我都想执行一个功能。根据文档（link），我应该使用useFocusEffect，这是我的代码：

import {useFocusEffect} from '@react-navigation/native'

export default function ProfileScreen(props) {
  const {loading} = props.store
  const [deviceId, setDeviceId] = React.useState(null)
  const [questionIndex, setQuestionIndex] = React.useState(0)

  console.log(useFocusEffect)

  useFocusEffect(
    React.useCallback(() => {
      console.log('here')
      //AsyncStorage.getItem('deviceId', (err, result) => {
      //  if (result !== null) {
      //    setDeviceId(result)
      //    props.dispatch({type: "STOP_LOADER"})
      //  }
      //})
    }, [])
  )

问题是，当应用加载时，我会收到此错误：

TypeError: (0, _native.useFocusEffect) is not a function.

我使用的版本是："@react-navigation/native": "^3.6.2",，我该如何解决？

编辑：问题是当前版本的react-navigation还不支持钩子，等待v5.0发布，我正在使用该库作为后备：https://github.com/react-navigation/hooks

Answer 1

版本4提供了类似useFocusEffect的钩子。如果无法升级到版本4，请查看版本3的文档：https://reactnavigation.org/docs/en/3.x/getting-started.html

Answer 2

做 npm install --save @react-navigation/native@4.0.0-alpha.2

3.6.2是最新的稳定版本。您可以在此处找到所有版本的react-navigation（在版本下）

https://www.npmjs.com/package/@react-navigation/native

Answer 3

不建议使用npm WARN @ react-navigation / native @ 4.0.0-alpha.2：请勿使用

阅读以下内容的输出：npm i --save @ react-navigation / native以查找最新版本

npm i-保存@ react-navigation / native @ ^ 5.0.5

react-navigation：useFocusEffect不是一个函数

3 个答案: