之前在記錄掃碼 在安卓時，會出現黑屏，錯位，閃退等等問題。解決方法在另一篇文章里 https://www.cnblogs.com/huzhuhua/p/11064764.html 。
當時以為 是解決了。后來打包到IOS上時也是 出現。原因是
plus.webview.create(location.href)這個不是在新的窗口打開，都是在同一窗口。我也不知道什么 原因。
當時以為是路徑問題，然后想到了換另一個地址試試。然后記錄了另一篇vue引用多入口 文件 https://www.cnblogs.com/huzhuhua/p/11202565.html。
后來還是不行。最終只能新建一個靜態的camera.html頁面，放在dist打包的文件夾內。一塊打包成APP。在調用上我是做了區分，安卓還是照上面 的文章做。IOS的話
就跳到camera.html。
具體代碼如下。
要跳轉去的VUE頁面上
let ws = plus.webview.create("./camera.html", "camera"); ws.show(); ws.addEventListener( "loaded", function() { //頁面加載完成后才顯示 setTimeout(function() { ws.show(); }, 200); }, false ); ws.addEventListener( "close", function() { ws = null; }, false );
camera.html頁面上
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>camera</title> <style> html, body, div, span, img { margin: 0; padding: 0; } body { background: #000; } .tips { margin-top: 50%; color: #fff; text-align: center } .action { position: fixed; z-index: 777; width: 100%; left: 0; bottom: 0; } .action .items { display: flex; justify-content: space-around; background: rgba(0, 0, 0, 0.35); width: 60%; padding: 4px; margin: 4px auto; } .action .items .item { flex-basis: 50px; text-align: center; } .action .items img { width: 27px; } </style> </head> <body> <div id="camera"> <div id="scan"></div> <div class="tips">加載中...</div> <div class="action"> <div class="items"> <div class="item" onclick="openLight"><img src="./src/assets/img/png-60@3x.png"></div> <div class="item" onclick="getPicture"><img src="./src/assets/img/png-59@3x.png"></div> <!-- <div class="item" @click="showInput" ><img src="../assets/img/png-68@3x.png"> </div> --> <div class="item" onclick="cancelScan"><img src="./src/assets/img/png-61@3x.png"></div> <!-- <d class="item"><img src="../../assets/img/png-25@3x.png"></d --> </div> </div> </div> </body> <script> var isLight = false, scan = null; // 打開閃光燈 function openLight() { isLight = !isLight; scan.setFlash(isLight); } //創建掃描控件 function startRecognize() { if (!window.plus) return; scan = null; scan = new plus.barcode.Barcode( "scan", [plus.barcode.QR, plus.barcode.EAN8, plus.barcode.EAN13], { frameColor: "#1294cb", scanbarColor: "#1294cb", top: "100px", left: "0px", width: "100%", height: "500px", position: "fixed" } ); // 條碼識別成功 scan.onmarked = onmarked; function onmarked(type, result, file) { result = result.replace(/\n/g, ""); localStorage.setItem("cameraData", result); let ws = plus.webview.getWebviewById("camera"); ws.close() } } // //開始掃描 function startScan() { if (!window.plus) return; startRecognize(); //創建控件 setTimeout(() => { scan.start(); }, 100); } // 取消掃描 function cancelScan() { if (!window.plus) return; plus.navigator.setStatusBarStyle("dark"); if (scan) { scan.cancel(); //關閉掃描 scan.close(); //關閉條碼識別控件 } let ws = plus.webview.getWebviewById("camera"); ws.close() } // 從相冊選取二維碼相片 function getPicture() { plus.gallery.pick(src => { // scan.cancel(); //關閉掃描 plus.barcode.scan( src, (type, result) => { scan.cancel(); //關閉掃描 scan.close(); localStorage.setItem("cameraData", result); plus.navigator.setStatusBarStyle("dark"); let ws = plus.webview.getWebviewById("camera"); ws.close() } ); }); } window.onload = function () { setTimeout(() => { plus.navigator.setStatusBarStyle("dark"); startScan() }, 400); } </script> </html>
這樣算解決了。折騰了N久