You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

82 lines
1.9 KiB

11 months ago
<template>
10 months ago
<view class="scan-bg">
<!-- <text>{{ result }}</text> -->
<qrcode-stream @decode="onDecode" @init="initQR" class="scan-code"/>
11 months ago
</view>
</template>
<script>
//引入
import { QrcodeStream } from "vue-qrcode-reader";
export default {
name: "scanCodeVue",
data() {
return {
result: '', //扫码结果信息
error: '',
}
},
components: {QrcodeStream},
methods: {
onDecode(result) {
this.result = result;
10 months ago
this.$emit("success", result)
11 months ago
},
async initQR(promise) {
let _this = this
10 months ago
try {
11 months ago
const { capabilities } = await promise;
const TORCH_IS_SUPPORTED = !!capabilities.torch;
10 months ago
11 months ago
let res = await promise;
console.log(res)
} catch (error) {
if (error.name === "NotAllowedError") {
this.error = "ERROR: 您需要授予相机访问权限";
} else if (error.name === "NotFoundError") {
this.error = "ERROR: 这个设备上没有摄像头";
} else if (error.name === "NotSupportedError") {
this.error = "ERROR: 所需的安全上下文(HTTPS、本地主机)";
} else if (error.name === "NotReadableError") {
this.error = "ERROR: 相机被占用";
} else if (error.name === "OverconstrainedError") {
this.error = "ERROR: 安装摄像头不合适";
} else if (error.name === "StreamApiNotSupportedError") {
this.error = "ERROR: 此浏览器不支持流API";
} else {
this.error = '获取摄像头权限失败'
}
_this.$emit("fail", this.error)
}
},
},
}
</script>
10 months ago
<style lang="scss" scoped>
*{
box-sizing: border-box;
}
.scan-bg{
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: 100vh;
background: black;
z-index: 99999;
.scan-code{
width: 100%;
height: 100%;
}
}
</style>