1.创建webView跳转公用文件(home是调用处);
<template>
<web-view :src="url"></web-view>
</template>
<script>
export default {
name: "index",
data(){
return{
url:''
}
},
onLoad(val){
//动态获取的url
this.url=decodeURIComponent(val.url)
}
}
</script>
<style scoped>
</style>
2.在使用页面调用webview跳转(encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。敲黑板~重点)
//页面调用处
<uni-grid-item @tap="queryCorpInfo">
<image class="image" src="../../../static/img/home/corpInfoImage.png" mode="aspectFill"></image>
<text class="text">跳转外部连接</text>
</uni-grid-item>
//执行方法
queryCorpInfo(){
let url = this.baseHtmlUrl+'qhbs_h5_v1/pages/corpInfo/corpInfo.html'
var typefrom = 'wechat';
url = encodeURIComponent(url + '?typefrom=${typefrom}');
uni.navigateTo({
url: '../../webview/index?url='+ url
});
}
3.html中获取携带的参数。
//获取地址栏参数,name:参数名称
function getUrlParms (name) {
let url = window.location.href;//获取请求进来的完整url
let tstr = url.substring(url.indexOf('?') + 1).split('&');//先截取url的?后面的参数部分,在根据&分割成参数数组
let result = {};
tstr.forEach((item) => {
let res = item.split('=');//res为type,my-component1.vue。 res[0]为type,res[1为]my-component1.vue
result[res[0]] = res[1];//构造成键值对形式 res[0]为键,res[1]为值 例:type: "my-component1.vue"
})
return result[name];//通过键取值
}
var type = getUrlParms("type");//调用函数即可