uniapp 用web-view嵌套网页地址并传参

小程序登陆后把token和openId 对应传到pc端 pc端有两套一套pc端代码和适应移动端的代码 嵌套的是适应移动端的代码

1.uniapp

javascript 复制代码
<template>
	<view class="main">
		<u-navbar :fixed="true" :autoBack="false" @leftClick="goBack"></u-navbar>
		<web-view :src="url" @message="message"></web-view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				url: '',
				token: '',
				canBack: false,
				openId: ''
			}
		},
		onLoad() {
			this.token = uni.getStorageSync('token');
			this.openId = uni.getStorageSync('openid');
			this.url = 'http://192.168.31.190:8888/mobile/?token=' + encodeURIComponent(this.token) + '&openId=' +
				encodeURIComponent(this.openId)
			console.log(this.url)
		},

	
		methods: {
			message(event) {
				console.log(event.detail.data);
			},


		},

	}
</script>
<style>
	.main {
		width: 100%;
		height: 100vh;
	}
</style>

2.vue3+vant pc端接收参数

javascript 复制代码
const token = ref("")
const openId = ref("")
onMounted(() => {
  var url = window.location.href;
  console.log(url)
  var regex = /[?&]token=([^&#]+)/; // 匹配 ? 或 & 后面跟 token= 开头的部分
  var regexId = /[?&]openId=([^&#]+)/; // 匹配 ? 或 & 后面跟 token= 开头的部分
  var match = url.match(regex);
  token.value = decodeURIComponent(match[1]);
  openId.value = decodeURIComponent(url.match(regexId)[1]);
})
相关推荐
梁正雄13 小时前
Python前端-2-css基础
前端·python·html
Mr Xu_13 小时前
巧用多背景图层打造精美 CSS 背景 —— 基于 SVG 的视觉合成技巧
前端·css
小杨勇敢飞13 小时前
npm 安装 @openai/codex 后无法调用 codex 命令的完整解决过程:‘codex‘ 不是内部或外部命令,也不是可运行的程序或批处理文件。
前端·npm·node.js
JEECG官方13 小时前
JeecgBoot低代码平台 Qiankun 微前端集成指南:主应用配置全流程
前端
JEECG官方13 小时前
JeecgBoot低代码平台从 WPS 切换到 OnlyOffice 的开发配置指南
前端
lichenyang45313 小时前
虚拟 DOM、Diff 算法与 Fiber
前端·javascript·面试
打酱油的D13 小时前
前端工程师转 AI Agent 工程师,先把后端能力补上
前端
lclcooky13 小时前
Spring 核心技术解析【纯干货版】- Ⅶ:Spring 切面编程模块 Spring-Instrument 模块精讲
前端·数据库·spring
angerdream13 小时前
最新版vue3+TypeScript开发入门到实战教程之学会vue3第一步必是setup语法糖
前端·vue.js
Invincible_14 小时前
OpenClaw DeepWiki 通俗版
前端·人工智能