在React Native应用中读取NFC标签 [英] read NFC tags in React Native app

问题描述

我想制作一个可以读取NFC标签的本地应用程序.我正在使用 react-native-nfc ，但无法正常运行.谁能帮我弄清楚我做错了什么，并指出正确的方向?

I want to make a react-native app which can read the NFC tags. I am using react-native-nfc but cannot get it working. Can anyone help with figuring out what I am doing wrong and point me in the right direction?

代码如下:

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  ToastAndroid
} from 'react-native';

import NFC, {NfcDataType, NdefRecordType} from "react-native-nfc";

export default class nfcTry extends Component {

  constructor(props){
    super(props);
  }

  componentDidMount(){
    this.bindNfcListener();
  }

  bindNfcListener(){
    NFC.addListener((payload)=>{
      alert(payload.data.id);
    })
  }

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to React Native!
        </Text>
      </View>
    );
  }
}

AndroidManifest.xml 中的代码如下:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.nfctry"
    android:versionCode="1"
    android:versionName="1.0">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    <uses-permission android:name="android.permission.NFC" />

    <uses-sdk
        android:minSdkVersion="16"
        android:targetSdkVersion="22" />

    <application
      android:name=".MainApplication"
      android:allowBackup="true"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:theme="@style/AppTheme">
      <activity
        android:name=".MainActivity"
        android:launchMode="singleTask"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
        android:windowSoftInputMode="adjustResize">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>

        <intent-filter>
            <action android:name="android.nfc.action.NDEF_DISCOVERED"/>
            <category android:name="android.intent.category.DEFAULT"/>
        </intent-filter>

        <intent-filter>
            <action android:name="android.nfc.action.TECH_DISCOVERED"/>
        </intent-filter>

        <meta-data android:name="android.nfc.action.TECH_DISCOVERED" android:resource="@xml/nfc_tech_filter" />

      </activity>
      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
    </application>

</manifest>

推荐答案

最后，我能够达到目标！ 此时，您的总代码丢失了另一个名为 nfc-ndef-react -本机.

Finally i am able to make it to the goal!! at this point of time your total code is missing with another npm package called nfc-ndef-react-native.

将以下软件包与您现有的代码链接，您可能会遇到NDK的一些问题，也请解决它们！最终，您将能够做到！我现在正在根据需要运行此应用.

Link the following package with your existing code and you might face some issues with NDK , solve them too ! finally you would be able to make it!! I am running this app right now as needed.

这篇关于在React Native应用中读取NFC标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！