這裡給大家分享我在網上總結出來的一些知識，希望對大家有所幫助 本文用一個簡單的 demo 講解 App端 半屏連續掃碼 的實現方式，包括（條形碼、二維碼等各種各樣的碼）。 我會從實現思路講起，如果你比較急可以直接跳到 動手實現 章節獲取代碼。 開發和運行環境 開發工具：HBuilderX 前端框架： ...
這裡給大家分享我在網上總結出來的一些知識，希望對大家有所幫助
本文用一個簡單的 demo 講解 App端 半屏連續掃碼 的實現方式，包括（條形碼、二維碼等各種各樣的碼）。
我會從實現思路講起，如果你比較急可以直接跳到 動手實現 章節獲取代碼。
開發和運行環境
需求收集
看到論壇上有人想在 App端 實現 連續掃碼 功能。
認真看了下圖，還是個 半屏 的掃碼框。
只是看到提了下需求，並沒搜到多少解決方案。
於是我去 uni-app官網 看了下，找到相關的內容：
但 <camera> 組件不支持 App 端使用（至少在寫本文時不支持）；
uni.scanCode 可以掃碼，但會跳到另一個界面，併在全屏的模式下掃碼，也不支持連續掃碼。
當然，用 uni.scanCode 可以在掃碼成功後再重新執行一次，這樣就能實現連續掃碼的功能，但界面會跳來跳去（跳到掃碼界面，成功後又跳回app的界面，再執行又跳到掃碼界面......）。
提煉需求
根據上面的信息，提煉出3個關鍵詞：
- App端
- 半屏
- 連續掃碼
我採用了 DCLOUD社區 《uni-app怎麼自定義掃碼和連續掃》 里的需求。粗略的寫了下佈局（我沒有精細寫樣式）
最終實現的效果如下圖所示
我用線上工具生成了2個二維碼，內容分別為 “雷猴” 和 “鯊魚辣椒”。
通過掃描二維碼，把內容添加到頁面中。
實現思路
查文檔
既然 uni-app 的組件和API 都沒有提供這方面的幫助，我就去 插件市場 看了下，要麼只支持小程式，要麼是收費的。
收費的？
