Question

我正在使用cordova + react js 作为实施NFC（近距离通信）的一部分，我下载了phonegap-nfc插件但是，当我尝试使用phonegap的nfc插件对象变量时，在我的一个javascript文件中抛出了异常。像（从'phonegap-nfc / www / phonegap-nfc'导入nfc;）收到的错误是：

未找到模块：错误：无法在'D：\ GIT \ lockers-app-ret中解析'cordova / exec' ail-wf_latest \ node_modules \ phonegap-nfc \ www'

下面提供的相关代码

handleNFCPopup =（）=> { console.log（“你好，你在NFC中弹出...”）;

// Read NDEF formatted NFC Tags
nfc.addNdefListener (
    (nfcEvent) =>{
        var tag = nfcEvent.tag,
            ndefMessage = tag.ndefMessage;

        // dump the raw json of the message
        // note: real code will need to decode
        // the payload from each record
        alert(JSON.stringify(ndefMessage));

        // assuming the first record in the message has
        // a payload that can be converted to a string.
        alert(nfc.bytesToString(ndefMessage[0].payload).substring(3));
    },
     () => { // success callback
        alert("Waiting for NDEF tag");
    },
    (error) =>{ // error callback
        alert("Error adding NDEF listener " + JSON.stringify(error));
    }
);

}

Answer 1

如果您使用的是Cordova，并使用cordova plugin add phonegap-nfc安装了该插件，那么Cordova将创建一个全局变量nfc（如果愿意，可以创建一个window.nfc。）您不需要导入phonegap-nfc.js自己。在Cordova工具将其包装之前，该文件实际上不是模块。另外，请确保在Cordova的nfc事件触发之前，不要在deviceready上调用任何函数。

Answer 2

doncoleman的回答很好，我要补充一点，以确保您在Cordova的deviceready事件之前不调用nfc上的任何函数，您可以在index.tsx中替换以下行：

ReactDOM.render(<App />, document.getElementById("root"));

与此：

document.addEventListener(
    "deviceready",
    () => ReactDOM.render(<App />, document.getElementById("root")),
    false
);

更多有关React + NFC +电容器或Cordova的文章： https://medium.com/@zwyx/nfc-on-android-with-react-and-typescript-using-capacitor-or-cordova-b525dba5f620

phonegap的nfc插件对象在我的一个javascript文件中引发异常

2 个答案: