React Native中react-native-wifi-reborn的WifiManager为null求助

以下是针对你遇到的WifiManager为null问题的排查和修复步骤：

可能的原因 #

WifiManager为null通常是依赖安装不完整、自动链接失败、权限配置缺失或代码使用不当导致的，按以下步骤逐一排查：

1. 重新安装并验证依赖 #

先卸载再重新安装依赖，确保安装过程无报错：

npm uninstall react-native-wifi-reborn
npm install react-native-wifi-reborn

如果使用Yarn：

yarn remove react-native-wifi-reborn
yarn add react-native-wifi-reborn

2. 手动检查Android端配置（重点） #

React Native 0.60+支持自动链接，但部分场景可能链接失败，需手动确认以下配置：

• android/settings.gradle：确认包含以下内容

  include ':react-native-wifi-reborn'
  project(':react-native-wifi-reborn').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-wifi-reborn/android')
  

• android/app/build.gradle：确认依赖已添加

  dependencies {
      // ... 其他依赖
      implementation project(':react-native-wifi-reborn')
  }
  

• MainApplication.java：确认模块已注册

  import com.reactlibrary.RNWifiRebornPackage;
  
  @Override
  protected List<ReactPackage> getPackages() {
      return Arrays.asList(
          new MainReactPackage(),
          new RNWifiRebornPackage() // 新增这行
      );
  }
  

3. 补充Android权限配置 #

在AndroidManifest.xml中添加必要权限（位于android/app/src/main/目录下）：

<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.CHANGE_WIFI_STATE" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<!-- Android 12及以上额外需要 -->
<uses-permission android:name="android.permission.CHANGE_NETWORK_STATE" />
<uses-permission android:name="android.permission.NEARBY_WIFI_DEVICES" />

4. 修正代码中的问题 #

（1）修复useEffect无限循环 #

原代码中useEffect未添加依赖数组，会导致组件反复渲染，改为只执行一次：

useEffect(() => {
  requestLocationPermission(); // 解开注释，Android必须申请位置权限才能扫描WiFi
  if (!WifiManager) {
    console.error("WifiManager is null");
    return;
  }

  try {
    WifiManager.getSSID((ssid) => {
      console.log("SSID:", ssid);
    });
  } catch (err) {
    console.warn(err);
  }

  WifiManager.loadWifiList((wifiArray) => {
    setWifiList(wifiArray);
  });
}, []); // 添加空数组，仅在组件挂载时执行一次

（2）修复Connect按钮的回调 #

原代码中onPress使用了未定义的handleConnectPress，替换为已实现的connectToNetwork：

<TouchableOpacity
  style={styles.connectButton}
  onPress={connectToNetwork} // 修改此处
>
  <Text style={styles.connectButtonText}>Connect</Text>
</TouchableOpacity>

5. 清理缓存并重建项目 #

最后清理React Native缓存并重新构建：

# 清理RN缓存
npx react-native start --reset-cache

# 重新构建Android
cd android && ./gradlew clean && cd .. && npx react-native run-android

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