vue里面写原生JS函数,安卓agentweb、webview与js操作，移动应用调用JS，移动混合开发JS互动

痛定思痛。 2023-06-27 12:58 8阅读 0赞

最近在做安卓混合开发时，遇到几个坑，在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>

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaWppYTM2MjQ_size_16_color_FFFFFF_t_70][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaWppYTM2MjQ_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20210323082233655.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaWppYTM2MjQ=,size_16,color_FFFFFF,t_70