vue nuxt 二维码阅读器安装

Question

我有一个 Nuxt.js 项目，在其中尝试使用qrcode-scanner 库， 我按照步骤进行全局注册。

我在插件文件夹中创建了一个js文件并添加以下代码

import Vue from "vue";
import VueQrcodeReader from "vue-qrcode-reader";

Vue.use(VueQrcodeReader);

它看起来很简单，但我的应用程序崩溃并且从未加载。有人遇到过这个问题吗？

Answer 1

我测试了你的代码，它对我有用，我为你解释了我的步骤，也许你忘记了一步：

1. 安装包与npm install vue-qrcode-reader
2. qr.js在我的plugin文件夹中创建名为的文件
3. 然后把这段代码放在上面：

import Vue from 'vue'
import VueQrcodeReader from 'vue-qrcode-reader'

Vue.use(VueQrcodeReader)

4. 将插件添加到我的nuxt.config.js文件中：

  plugins: ['~/plugins/qr']

注意：qr是我的文件名（qr.js）

5. 在我的 vue 页面中使用该插件，并在其中添加以下代码：

<qrcode-stream></qrcode-stream>
<qrcode-drop-zone></qrcode-drop-zone>
<qrcode-capture></qrcode-capture>