// #ifdef H5
// 引入uni.webview.1.5.4.js
import '@/mixin/uni.webview.1.5.4.js';
// #endif

  mounted() {
  //document.addEventListener() 方法用于向文檔添加事件句柄，即事件監(jiān)聽(tīng)。當(dāng)相應(yīng)的事件發(fā)生了，就執(zhí)行對(duì)應(yīng)的函數(shù)。
            document.addEventListener("getAppMsg", (e) => {
                //webview接收uniapp傳過(guò)來(lái)的信息
                console.log('getAppMsg', e.detail.code)
            }, false)
        },
 methods: {
            testScan() {
               //h5向app傳參，觸發(fā)事件
                uni.webView.postMessage({
                    data: {
                        action: 'scanCode',
                    }
                })
            }
            }

//template
   <web-view :src="src" @message="message"></web-view>

//script
onLoad() {
            
            let height = 0; //定義動(dòng)態(tài)的高度變量
            let statusbar = 0; // 動(dòng)態(tài)狀態(tài)欄高度
            uni.getSystemInfo({ // 獲取當(dāng)前設(shè)備的具體信息
                success: (sysinfo) => {
                    statusbar = sysinfo.statusBarHeight + 55;
                    height = sysinfo.windowHeight - 65;
                    console.log("高度", statusbar, height)
                }
            });
            // #ifdef APP-PLUS
            let currentWebview = this.$mp.page.$getAppWebview(); //獲取當(dāng)前web-view 
            let that = this
            setTimeout(function() {
                that.wv = currentWebview.children()[0];
                that.wv.setStyle({ //設(shè)置web-view距離頂部的距離以及自己的高度，單位為px
                    top: statusbar, //此處是距離頂部的高度，應(yīng)該是你頁(yè)面的頭部
                    height: height, //webview的高度
                })
            }, 200); //如頁(yè)面初始化調(diào)用需要寫(xiě)延遲
            // #endif
        },
  methods: {
            message(e) {
                //接收H5發(fā)送給app的消息      
                // e.detail.data即為H5中uni.webView.postMessage()的data的內(nèi)容
                let mesg = e.detail.data[0]
                console.log("mesg", mesg)
                if (mesg.action == "scanCode") {
                    // 允許從相機(jī)和相冊(cè)掃碼
                    uni.scanCode({
                        onlyFromCamera: true, //只允許通過(guò)相機(jī)掃碼
                        scanType: ['qrCode'], //調(diào)起條碼掃描
                        autoDecodeCharset: true,
                        success: (res) => {
                            console.log(`res=${res.result}`) //res.result為掃碼結(jié)果
                            this.wv.evalJS( 
  "document.dispatchEvent(new CustomEvent('getAppMsg',{detail: {code:" +JSON.stringify(res.result) + "}}))"
                            )
          //通過(guò)evalJS()，傳入方法字符串，將該方法內(nèi)部的字符串在webview的H5中當(dāng)做js代碼去執(zhí)行。
          //document.dispatchEvent（）為創(chuàng)建自定義事件在h5中執(zhí)行
            							}
            							}）
            		}
            }
       }