最近在做安卓混合開發時,遇到幾個坑,在vue寫的界面裏面調用原生js去調用安卓插件agentweb的安卓條碼掃描功能,
最後是agentweb調用web的原生JS出問題,問題1:在vue界面裏面放原生的function在哪裏?經過多輪研究,問題1終於解決了,但又遇到個問題2:原生函數把值給了input控件,但vue取不到input的值。查查資料又解決了。
解決問題一:原生JS函數放在哪裏?要放在導出html模板文件裏面,而不是放在寫的vue界面裏面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>SCAN_Demo</title>
<script type="text/javascript">
function SCANRsult(key){
document.getElementById("SCANText").value = key;
document.getElementById("bt_SCAN").click();
}
</script>
</head>
<body>
<div id="app"></div>
</body>
</html>
解決問題二:原生的JS把值賦給input,vue取不到綁定的input值。
document.getElementById("DemoInput").dispatchEvent(new Event('input'));
解決問題二:返回的條碼怎麼知道放到哪個Input裏面。
<template>
<div style="display:none;">
<input id="SCAN" v-model="dongtai" data-msg="gem01" ref="dataMsg" @keyup.enter="handleinput" />
<button @click="bt_click()" id="bt_SCAN">Add 1</button>
</div>
</template>
<script>
//調用按鈕
scan_click(){
document.getElementById("SCAN").dispatchEvent(new Event('input'));
this.dt_name=this.$refs.dataMsg.dataset.msg;
this[this.dt_name]=this.dongtai;
},
bt_click(){
document.getElementById("SCAN").dispatchEvent(new Event('input'));
this.dt_name=this.$refs.dataMsg.dataset.msg;
this[this.dt_name]=this.dongtai;
},
</script>