uni-app实现扫码

深藏阁楼爱情的钟 2023-06-26 10:41 56阅读 0赞

uni-app在逐步的完善，用这个框架来做app还是挺方便的，由于客户需求，需要做扫码的功能，去uni-app的官网上搜了一下，还真有这个功能。

主要用的就是uni.scanCode(\{\})这个函数，直接拿过来用就可以了，但是要注意不能在H5上用，app上用用还是很方便的。

先上图看看运行结果：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NoaWNob25nMTIz_size_16_color_FFFFFF_t_70][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NoaWNob25nMTIz_size_16_color_FFFFFF_t_70 1][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NoaWNob25nMTIz_size_16_color_FFFFFF_t_70 2][]

关键代码在这：

scan1() {
                     let that = this;
                     // 允许从相机和相册扫码
                     uni.scanCode({
                         success: function(res) {
                             that.result1 = res.result;
                         }
                     });
                 },
                 scan2() {
                     let that = this;
                     // 只允许通过相机扫码
                     uni.scanCode({
                         onlyFromCamera: true,
                         success: function(res) {
                             that.result2 = res.result;
                             console.log('条码类型：' + res.scanType);
                             console.log('条码内容：' + res.result);
                         }
                     });
                 },
                 scan3() {
                     let that = this;
                     // 调起条码扫描
                     uni.scanCode({
                         scanType: 'barCode',
                         success: function (res) {
                             that.result3 = res.result;
                             console.log('条码类型：' + res.scanType);
                             console.log('条码内容：' + res.result);
                         }
                     });
                 }

这三个函数我都测试了，可以扫描二维码，也可以扫条形码，区别就是能不能从相册选择图片，根据需求选择其中一个就可以了。

附上二维码可以进行扫描测试。扫出来的结果如上，就OK啦。

![20191231121218576.png][]

有任何疑问，欢迎留言交流。

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NoaWNob25nMTIz_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20191231120734107.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NoaWNob25nMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NoaWNob25nMTIz_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20191231120820139.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NoaWNob25nMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NoaWNob25nMTIz_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20191231120840429.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NoaWNob25nMTIz,size_16,color_FFFFFF,t_70
[20191231121218576.png]: https://img-blog.csdnimg.cn/20191231121218576.png