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

相关推荐
Predestination王瀞潞7 分钟前
WEB前端技术基础(第四章:JavaScript-网页动态交互语言)
前端·javascript·交互
静西子2 小时前
Vue3路由
前端·javascript·vue.js
J总裁的小芒果2 小时前
vue3 全局定义动态样式
前端·javascript·vue.js
whalekv2 小时前
10月25日
前端·javascript·vue.js
Never_Satisfied6 小时前
在JavaScript / Node.js / 抖音小游戏中,使用tt.request通信
开发语言·javascript·node.js
啃火龙果的兔子8 小时前
前端八股文react篇
前端·react.js·前端框架
打小就很皮...8 小时前
React 实现 i18next 中英文切换集成
前端·react.js·i18next
拉不动的猪8 小时前
函数组件和异步组件
前端·javascript·面试
淮北4948 小时前
html + css +js
开发语言·前端·javascript·css·html
掘金安东尼10 小时前
Transformers.js:让大模型跑进浏览器
开发语言·javascript·ecmascript