vue做混合式app_vue与原生app的对接交互的方法(混合开发)

小伙伴们在用vue开发h5项目特别是移动端的项目，很多都是打包后挂载在原生APP上的，那就少不了与原生交互了，我最近就是在坐这个，踩了一些坑，拿出来给大家分享下。

0.通过url传输数据：(一般是在入口页面传下app的用户信息进来供vue h5使用)

methods: {

// 接收url后的数据

urltext() {

let loc = location.href; 6 let n1 = loc.length;//地址的总长度

let n2 = loc.indexOf("=");//取得=号的位置

let outToken = loc.substr(n2 + 1, n1 - n2);//从=号后面的内容

console.log(loc,n1,n2,outToken)

this.outTokenPost(outToken) //传到处理函数

},

}

1.原生APP提供一个接口对象的引用(例如一个扫码的接口，可能还有回调函数以获得扫码结果)

思路就是万物通过window 进行交互

// 将vue组件的要回调的函数暴露出去

mounted:function(){

// 将subscanQRCallBack方法绑定到window下面，提供给外部调用

window['scanQRCallBack'] = (result) => {

this.subscanQRCallBack(result)

}

},

methods:{