NativeScript-vue添加插件失败

Question

我有一个关于安装pluin…的问题尝试了2周的，但仍未得到。

我在{NS}-vue上使用-vue，在npm安装之后，我做rm -rf platform，并在app.js文件中添加Vue.registerElement('BarcodeScanner', () => require('nativescript-barcodescanner').BarcodeScannerView)。在Home.vue中，我添加

<BarcodeScanner
    row="1"
    height="300"
    formats="QR_CODE, EAN_13, UPC_A"
    beepOnScan="true"
    reportDuplicates="true"
    preferFrontCamera="false"
    @scanResult="onScanResult"
    v-if="isIOS">
</BarcodeScanner>

并删除v-if并创建onScanResult方法。并添加import { BarcodeScanner } from "nativescript-barcodescanner";

完成所有操作后，仍然会出现以下错误：

有人能帮我吗？我尝试了许多插件，但仍然失败。(看了一些youtube视频)

An uncaught Exception occurred on "main" thread.
java.lang.RuntimeException: Unable to start activity ComponentInfo{org.nativescript.BXBQRCodeScanner/com.tns.NativeScriptActivity}: com.tns.NativeScriptException: 
Calling js method onCreate failed

TypeError: viewClass is not a constructor
File: "file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js, line: 4225, column: 6

StackTrace: 
    Frame: function:'ElementNode', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 8654, column: 24
    Frame: function:'createElement', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 8745, column: 12
    Frame: function:'createElement', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 8804, column: 23
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5419, column: 79
    Frame: function:'createChildren', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5538, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5424, column: 9
    Frame: function:'createChildren', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5538, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5424, column: 9
    Frame: function:'patch', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5999, column: 7
    Frame: function:'Vue._update', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5025, column: 19
    Frame: function:'updateComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5137, column: 10
    Frame: function:'get', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4220, column: 25
    Frame: function:'Watcher', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4207, column: 45
    Frame: function:'mountComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5143, column: 3
    Frame: function:'push.../node_modules/nativescript-vue/dist/index.js.Vue.$mount', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 13478, column: 10
    Frame: function:'init', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 12455, column: 13
    Frame: function:'createComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5452, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5401, column: 9
    Frame: function:'patch', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5999, column: 7
    Frame: function:'Vue._update', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5025, column: 19
    Frame: function:'updateComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5137, column: 10
    Frame: function:'get', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4220, column: 25
    Frame: function:'Watcher', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4207, column: 45
    Frame: function:'mountComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5143, column: 3
    Frame: function:'push.../node_modules/nativescript-vue/dist/index.js.Vue.$mount', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 13478, column: 10
    Frame: function:'init', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 12455, column: 13
    Frame: function:'createComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5452, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5401, column: 9
    Frame: function:'createChildren', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5538, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5424, column: 9
    Frame: function:'patch', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5999, column: 7
    Frame: function:'Vue._update', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5025, column: 19
    Frame: function:'updateComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5137, column: 10
    Frame: function:'get', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4220, column: 25
    Frame: function:'Watcher', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4207, column: 45
    Frame: function:'mountComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5143, column: 3
    Frame: function:'push.../node_modules/nativescript-vue/dist/index.js.Vue.$mount', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 13478, column: 10
    Frame: function:'init', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 12455, column: 13
    Frame: function:'createComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5452, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5401, column: 9
    Frame: function:'patch', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5999, column: 7
    Frame: function:'Vue._update', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5025, column: 19
    Frame: function:'updateComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5137, column: 10
    Frame: function:'get', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4220, column: 25
    Frame: function:'Watcher', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4207, column: 45
    Frame: function:'mountComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5143, column: 3
    Frame: function:'push.../node_modules/nativescript-vue/dist/index.js.Vue.$mount', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 13478, column: 10
    Frame: function:'', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 13494, column: 10
    Frame: function:'Observable.notify', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 17945, column: 15
    Frame: function:'notifyLaunch', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 39801, column: 15
    Frame: function:'ActivityCallbacksImplementation.setActivityContent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 39734, column: 20
    Frame: function:'ActivityCallbacksImplementation.onCreate', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 39568, column: 10
    Frame: function:'NativeScriptActivity.onCreate', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 36930, column: 21


    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2913)
    at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:3048)
    at android.app.servertransaction.LaunchActivityItem.execute(LaunchActivityItem.java:78)
    at android.app.servertransaction.TransactionExecutor.executeCallbacks(TransactionExecutor.java:108)
    at android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:68)
    at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1808)
    at android.os.Handler.dispatchMessage(Handler.java:106)
    at android.os.Looper.loop(Looper.java:193)
    at android.app.ActivityThread.main(ActivityThread.java:6669)
    at java.lang.reflect.Method.invoke(Native Method)
    at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:493)
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:858)
Caused by: com.tns.NativeScriptException: 
Calling js method onCreate failed

TypeError: viewClass is not a constructor
File: "file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js, line: 4225, column: 6

StackTrace: 
    Frame: function:'ElementNode', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 8654, column: 24
    Frame: function:'createElement', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 8745, column: 12
    Frame: function:'createElement', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 8804, column: 23
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5419, column: 79
    Frame: function:'createChildren', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5538, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5424, column: 9
    Frame: function:'createChildren', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5538, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5424, column: 9
    Frame: function:'patch', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5999, column: 7
    Frame: function:'Vue._update', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5025, column: 19
    Frame: function:'updateComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5137, column: 10
    Frame: function:'get', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4220, column: 25
    Frame: function:'Watcher', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4207, column: 45
    Frame: function:'mountComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5143, column: 3
    Frame: function:'push.../node_modules/nativescript-vue/dist/index.js.Vue.$mount', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 13478, column: 10
    Frame: function:'init', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 12455, column: 13
    Frame: function:'createComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5452, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5401, column: 9
    Frame: function:'patch', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5999, column: 7
    Frame: function:'Vue._update', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5025, column: 19
    Frame: function:'updateComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5137, column: 10
    Frame: function:'get', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4220, column: 25
    Frame: function:'Watcher', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4207, column: 45
    Frame: function:'mountComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5143, column: 3
    Frame: function:'push.../node_modules/nativescript-vue/dist/index.js.Vue.$mount', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 13478, column: 10
    Frame: function:'init', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 12455, column: 13
    Frame: function:'createComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5452, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5401, column: 9
    Frame: function:'createChildren', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5538, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5424, column: 9
    Frame: function:'patch', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5999, column: 7
    Frame: function:'Vue._update', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5025, column: 19
    Frame: function:'updateComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5137, column: 10
    Frame: function:'get', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4220, column: 25
    Frame: function:'Watcher', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4207, column: 45
    Frame: function:'mountComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5143, column: 3
    Frame: function:'push.../node_modules/nativescript-vue/dist/index.js.Vue.$mount', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 13478, column: 10
    Frame: function:'init', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 12455, column: 13
    Frame: function:'createComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5452, column: 9
    Frame: function:'createElm', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5401, column: 9
    Frame: function:'patch', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5999, column: 7
    Frame: function:'Vue._update', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5025, column: 19
    Frame: function:'updateComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5137, column: 10
    Frame: function:'get', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4220, column: 25
    Frame: function:'Watcher', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 4207, column: 45
    Frame: function:'mountComponent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 5143, column: 3
    Frame: function:'push.../node_modules/nativescript-vue/dist/index.js.Vue.$mount', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 13478, column: 10
    Frame: function:'', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 13494, column: 10
    Frame: function:'Observable.notify', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 17945, column: 15
    Frame: function:'notifyLaunch', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 39801, column: 15
    Frame: function:'ActivityCallbacksImplementation.setActivityContent', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 39734, column: 20
    Frame: function:'ActivityCallbacksImplementation.onCreate', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 39568, column: 10
    Frame: function:'NativeScriptActivity.onCreate', file:'file:///data/data/org.nativescript.BXBQRCodeScanner/files/app/vendor.js', line: 36930, column: 21


    at com.tns.Runtime.callJSMethodNative(Native Method)
    at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1120)
    at com.tns.Runtime.callJSMethodImpl(Runtime.java:1000)
    at com.tns.Runtime.callJSMethod(Runtime.java:987)
    at com.tns.Runtime.callJSMethod(Runtime.java:967)
    at com.tns.Runtime.callJSMethod(Runtime.java:959)
    at com.tns.NativeScriptActivity.onCreate(NativeScriptActivity.java:18)
    at android.app.Activity.performCreate(Activity.java:7136)
    at android.app.Activity.performCreate(Activity.java:7127)
    at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1271)
    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2893)
    ... 11 more

Answer 1

<BarcodeScanner
    row="1"
    height="300"
    formats="QR_CODE, EAN_13, UPC_A"
    beepOnScan="true"
    reportDuplicates="true"
    preferFrontCamera="false"
    @scanResult="onScanResult"
    v-if="isIOS">
</BarcodeScanner>

不能直接删除v-if="isIOS"。

<BarcodeScanner>组件仅在iOS中可用。

因此，只需将v-if="isIOS"保留在Vue模板代码上即可。

Answer 2

您是否使用BarcodeScanner视图在GridLayout中，因为我看到它具有属性row of GridLayout

或者试试插件的演示应用程序(如果它能工作链接的话)