微信小程序扫描二维码或者条码
生活随笔
收集整理的這篇文章主要介紹了
微信小程序扫描二维码或者条码
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
最近在做一個產品,程序是需要掃描條形碼然后跳轉到對應的產品信息頁,其實微信小程序就有一個掃碼識別的API,下面一起來看看:
wx.scanCode(Object object)
調起客戶端掃碼界面進行掃碼。
示例代碼:
//?允許從相機和相冊掃碼
wx.scanCode({
??success(res)?{
????console.log(res)
??}
})
//?只允許從相機掃碼
wx.scanCode({
??onlyFromCamera:?true,
??success(res)?{
????console.log(res)
??}
})
WXML部分(應用):
<view?class='form-list'>
??<text>條形碼</text>
??<input?type='text'?value='{{scanCodeMsg}}'></input>
??<image?class='scan'?bindtap='scanCode'?src='/images/scanCode.png'?mode='widthFix'></image>
</view>
給掃描按鈕的圖片綁定一個事件,點擊調用攝像頭掃碼,掃描成功將數值賦給 input 輸入框的 value 值。效果如下圖:
JS 部分(應用):
data:?{
??scanCodeMsg:?"",
},
scanCode:?function()?{
??var?that?=?this;
??wx.scanCode({?//掃描API
????success(res)?{?//掃描成功
??????console.log(res)?//輸出回調信息
??????that.setData({
????????scanCodeMsg:?res.result
??????});
??????wx.showToast({
????????title:?'成功',
????????duration:?1000
??????})
????}
??})
},
參數 Object object
| 屬性 | 類型 | 默認值 | 說明 |
|---|---|---|---|
| onlyFromCamera | boolean | false | 是否只能從相機掃碼,不允許從相冊選擇圖片 |
| scanType | Array.<string> | ['barCode', 'qrCode'] | 掃碼類型 |
| success | function | 接口調用成功的回調函數 | |
| fail | function | 接口調用失敗的回調函數 | |
| complete | function | 接口調用結束的回調函數(調用成功、失敗都會執行) |
object.scanType 的合法值
| 值 | 說明 |
|---|---|
| barCode | 一維碼 |
| qrCode | 二維碼 |
| datamatrix | Data Matrix 碼 |
| pdf417 | PDF417 條碼 |
object.success 回調函數
參數
Object res
| 屬性 | 類型 | 說明 |
|---|---|---|
| result | string | 所掃碼的內容 |
| scanType | string | 所掃碼的類型 |
| charSet | string | 所掃碼的字符集 |
| path | string | 當所掃的碼為當前小程序二維碼時,會返回此字段,內容為二維碼攜帶的 path |
| rawData | string | 原始數據,base64編碼 |
res.scanType 的合法值
| 值 | 說明 |
|---|---|
| QR_CODE | 二維碼 |
| AZTEC | 一維碼 |
| CODABAR | 一維碼 |
| CODE_39 | 一維碼 |
| CODE_93 | 一維碼 |
| CODE_128 | 一維碼 |
| DATA_MATRIX | 二維碼 |
| EAN_8 | 一維碼 |
| EAN_13 | 一維碼 |
| ITF | 一維碼 |
| MAXICODE | 一維碼 |
| PDF_417 | 二維碼 |
| RSS_14 | 一維碼 |
| RSS_EXPANDED | 一維碼 |
| UPC_A | 一維碼 |
| UPC_E | 一維碼 |
| UPC_EAN_EXTENSION | 一維碼 |
| WX_CODE | 二維碼 |
| CODE_25 | 一維碼 |
以上就是關于微信小程序掃描二維碼的相關介紹,希望文章對你有所幫助。
總結
以上是生活随笔為你收集整理的微信小程序扫描二维码或者条码的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 红楼梦简介
- 下一篇: dnf鸟背一周打几次(地下城与勇士)