uniapp与webview之间的相互传值的实现
(编辑:jimmy 日期: 2024/11/27 浏览:3 次 )
1.uni-app 如何发送数据到 H5? 其实很接单、在 web-view 中只需要通过 URL 就可以向 H5 进行传参 例如在 uni-app 中:
<template> <view class="advertisement" style="width: 100%;"> <web-view :src="/UploadFiles/2021-04-02/url">那么在 H5 中是如何接收值得呢?
console.log(getQuery('data')); //获取 uni-app 传来的值 //取url中的参数值 function getQuery(name) { // 正则:[找寻'&' + 'url参数名字' = '值' + '&']('&'可以不存在) let reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); let r = window.location.search.substr(1).match(reg); console.log(r); if(r != null) { // 对参数值进行解码 return decodeURIComponent(r[2]); } return null; }2.webview向uniapp传值
<script> document.addEventListener('UniAppJSBridgeReady', function() { //向uniapp传值 uni.postMessage({ data: { action: 'message' } }); uni.getEnv(function(res) { console.log('当前环境:' + JSON.stringify(res)); }); }); </script>uniapp接受
//message接受方法 <template> <view class="advertisement" style="width: 100%;"> <web-view :src="/UploadFiles/2021-04-02/url">
下一篇:基于Element封装一个表格组件tableList的使用方法