安装react-navigation依赖后遇_reactNative.Dimensions.removeEventListener报错求助

问题原因 #

React Native 0.65及以上版本移除了Dimensions.removeEventListener方法，改用remove()方法。你当前使用的react-navigation v4系列依赖（包括react-navigation-stack、react-navigation-tabs）内部仍在调用已废弃的removeEventListener，导致兼容性报错。

修复方案 #

方案1：补丁修复（适配教程进度，无需修改依赖版本） #

用patch-package给相关依赖打补丁，替换内部调用的API：

1. 安装工具依赖：

npm install patch-package postinstall-postinstall --save-dev

2. 找到node_modules/react-navigation-stack/lib/commonjs/utils/useDimensions.js以及react-navigation-tabs中调用Dimensions.removeEventListener的文件，将：

Dimensions.removeEventListener('change', onDimensionsChange);

替换为：

const subscription = Dimensions.addEventListener('change', onDimensionsChange);
// 清理函数中改为调用remove
subscription.remove();

3. 生成补丁文件：

npx patch-package react-navigation-stack react-navigation-tabs

4. 在package.json的scripts中添加自动补丁脚本：

"postinstall": "patch-package"

后续安装依赖时会自动应用补丁。

方案2：降级React Native版本 #

将React Native降级到0.64.x版本，该版本仍支持Dimensions.removeEventListener，和你当前的react-navigation v4版本完全兼容。

方案3：使用验证过的兼容版本组合 #

如果允许微调版本，可采用以下经过测试的版本搭配：

"react-navigation": "^4.4.4",
"react-navigation-stack": "^2.10.4",
"react-navigation-tabs": "^2.11.2",
"react-native": "0.64.3"

内容的提问来源于stack exchange，提问作者Ceci Benitez