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获取数据做处理。

相关推荐
梦想CAD控件3 分钟前
在线CAD开发包结构与功能说明
前端·javascript·vue.js
时光不负努力15 分钟前
TS 常用工具类型
前端·javascript·typescript
Hilaku23 分钟前
我会如何考核一个在简历里大谈 AI 提效的高级前端?
前端·javascript·面试
进击的尘埃36 分钟前
Vue3 中 emit 能 await 吗?事件机制里的异步陷阱
javascript
青青家的小灰灰1 小时前
React 反模式(Anti-Patterns)排查手册:从性能杀手到逻辑陷阱
前端·javascript·react.js
青青家的小灰灰1 小时前
告别 Prop Drilling:Context API 的陷阱、Reducer 模式与原子化状态库原理
前端·javascript·react.js
进击的尘埃1 小时前
CSS 变量 + 主题切换:从 CSS-in-JS 回归原生方案的实践之路
javascript
csdn飘逸飘逸1 小时前
Autojs基础-按键模拟(keys)
javascript
wuhen_n1 小时前
Suspense:异步组件加载机制
前端·javascript·vue.js
wuhen_n1 小时前
Teleport:渲染到任意DOM节点
前端·javascript·vue.js