React Native Expo中react-native-nfc-manager调用isSupported时报TypeError求助

核心原因 #

出现TypeError: Cannot convert null value to object的主要原因是未提前初始化NFC管理器，或者调用时机过早，导致内部依赖的原生模块实例为null，无法完成后续类型转换操作。

具体解决步骤 #

1. 初始化NfcManager #

必须在调用任何NFC相关API前，先调用NfcManager.start()或NfcManager.initialize()（不同版本方法名可能有差异，以当前安装包版本为准）初始化模块。修改代码如下：

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View, useEffect } from 'react-native';
import NfcManager, {Ndef, NfcTech, ByteParser} from 'react-native-nfc-manager';

export default function App() {
  useEffect(() => {
    const initNfc = async () => {
      // 初始化NFC管理器
      await NfcManager.start();
      // 初始化完成后再检查Mifare支持情况
      try {
        await NfcManager.isSupported(NfcTech.MifareClassic);
        console.log('Mifare is supported');
      } catch (err) {
        console.warn('Mifare is not supported or error occurred:', err);
      }
    };

    initNfc();

    // 组件卸载时清理NFC资源
    return () => {
      NfcManager.stop();
    };
  }, []);

  return (
    <View style={styles.container}>
      <Text>Open up App.js to start working on your app!</Text>
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

2. 适配Expo环境 #

如果是Expo托管项目，需要额外处理：

• 安装Expo NFC依赖：

  npx expo install expo-nfc
  

• 在app.json/app.config.js中配置NFC权限：

  {
    "expo": {
      "android": {
        "permissions": [
          "android.permission.NFC"
        ]
      },
      "ios": {
        "infoPlist": {
          "NFCReaderUsageDescription": "需要使用NFC功能读取Mifare卡片"
        }
      }
    }
  }
  

3. 确认调用时机 #

将NFC操作放在useEffect钩子中，确保组件挂载完成后再执行，避免在组件初始化阶段直接调用导致模块未就绪。

额外注意事项 #

• 必须使用真实的Android/iOS设备测试，模拟器不支持NFC功能。
• 部分Android设备硬件本身不支持MifareClassic，即使NFC整体可用，也会进入catch分支，属于正常情况。

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