uni-app 前端 uniapp webview h5和app交互通信传参

app端,onPostMessage在nvue页面下接受参数，message在vue页面下接受参数

//接受网页传递的信息

message(e){

console.log('来自网页',e)

let data = e.detail.data[0];

},

链接后拼接传参，只在一开始能传

let obj = {

aa:'fsafsafsaf',

token: info.token,

bb:'bvvvvvvv'

};

console.log('收拾收拾',obj)

let fs = JSON.stringify(obj);

let params = encodeURIComponent(fs);

this.mapUrl = 'h5链接?jyy='+params;

方法传参

data(){

return{

wv:null, // 定义(app)webview对象节点

}

}

onReady() {

// #ifdef APP-PLUS

//此对象相当于html5plus里的plus.webview.currentWebview()。在uni-app里vue页面直接使用plus.webview.currentWebview()无效

var currentWebview = this.$scope.$getAppWebview();

setTimeout(() => {

this.wv = currentWebview.children()[0]

}, 1000); //如果是页面初始化调用时，需要延时一下

// #endif

},

methods:{

//向H5页面发送消息

upH5Event(msg){

// console.log(this.wv,'this.wv');

msg = JSON.stringify({name:'山粉虫水一雕',sdd:1561515})

this.wv.evalJS(`postJS(${msg})`);

},

}

H5端，我这是用vue2写的 在index.html页面加上这个

在首页接受参数

let data = this.$route.query.jyy;//通过获取链接地址拿参数

往APP传参

uni.webView.postMessage({

data:{

name:'on no!!!!',

type:666

}

});

接受APP的方法传参，变量跟data里面的变量绑定

精彩文章

 您阅读本篇文章共花了：