react组件向html传值

遇到三方地图只能使用html来构造交互页面,而且地图部署在跳板机,这时需要将react组件内值传递给html页面进行处理,也适用于react组件向html传值,上代码

javascript 复制代码
let arr ={name:'aa',value:'11'}
for (let key in arr) {
    paramUrl += "&" + key + "=" + item[key];
}
//拼接到需要传值的html地址
`aa.html?` + paramUrl

需要接值的html

javascript 复制代码
function QueryString(val) {
    var uri = location.search;
    var re = new RegExp("" + val + "\=([^\&\?]*)", "ig");
    return ((uri.match(re)) ? (uri.match(re)[0].substr(val.length + 1)) : null);
}
let name = decodeURI(QueryString('name'));
let address = decodeURI(QueryString('value'));
//变量内即是组件传递过来的值

如果数据过多,不建议使用这个方法,可以在html直接api获取数据做处理。

相关推荐
To_OC8 小时前
LC 131 分割回文串:刚学回溯时,我连怎么切字符串都想不明白
javascript·算法·leetcode
触底反弹9 小时前
一文搞懂 Tailwind CSS 弹性布局:从原理到实战
前端·css·html
To_OC10 小时前
LC 42 接雨水:暴力超时卡半天?前后缀数组一用就通了
javascript·算法·leetcode
小林ixn10 小时前
从 ??= 到 onKeyDown:一个 React 组件的“自我修养”
前端·javascript·react.js
এ慕ོ冬℘゜11 小时前
前端实战:jQuery 多条件联合搜索(标题模糊查询 + 日历时间段筛选)
前端·javascript·jquery
随心点儿11 小时前
js postMessage 实现跨域发送消息-应用示例
javascript·ecmascript·postmessage
kyriewen13 小时前
我让AI改一个bug——它偷偷动了5个我没让它碰的地方
前端·javascript·ai编程
gis开发之家17 小时前
《Vue3 从入门到大神35篇》Vue3 源码详解(五):effect 依赖收集原理——track 与 trigger 是如何工作的?
javascript·typescript·前端框架·vue3·vue3源码
半个落月18 小时前
用 React 搭一个 WebGPU 模型加载页:从状态驱动到可复用进度条
前端·react.js
橘子星18 小时前
我一个前端切图仔,凭什么能在浏览器里跑大模型?
前端·javascript·前端框架