qrcode-reader内容参考:https://blog.csdn.net/qq_37816525/article/details/100532716
功能实现了:
一行是text文本框,输入内容在框失去焦点时要在下面图片显示区域生成二维码。另一行显示二维码图片,在文本中没有数据时要显示提交图片按钮,上传二维码识别内容后显示二维码,并把值赋值给上面的文本框,隐藏提交按钮。
HTML代码:
<el-form-item label="二维码内容">
<el-input v-model="codeContent" @blur="createQRcode"></el-input>
</el-form-item>
<el-form-item label="二维码图片">
<img v-if="codeContent" id="qrcodeImg"></img>
<!-- 转换后图片显示位置 -->
<div class="image-box">
<input v-if="!codeContent" accept="image/*" id="file" type="file" @change="handleImageUpload" />
</div>