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

相关推荐
hh随便起个名6 小时前
力扣二叉树的三种遍历
javascript·数据结构·算法·leetcode
我是小路路呀7 小时前
element级联选择器:已选中一个二级节点,随后又点击了一个一级节点(仅浏览,未确认选择),此时下拉框失去焦点并关闭
javascript·vue.js·elementui
敲敲了个代码8 小时前
隐式类型转换:哈基米 == 猫 ? true :false
开发语言·前端·javascript·学习·面试·web
澄江静如练_8 小时前
列表渲染(v-for)
前端·javascript·vue.js
JustHappy8 小时前
「chrome extensions🛠️」我写了一个超级简单的浏览器插件Vue开发模板
前端·javascript·github
sg_knight8 小时前
拥抱未来:ECMAScript Modules (ESM) 深度解析
开发语言·前端·javascript·vue·ecmascript·web·esm
开发者小天8 小时前
react中useEffect的用法,以及订阅模式的原理
前端·react.js·前端框架
前端白袍9 小时前
Vue:如何实现一个具有复制功能的文字按钮?
前端·javascript·vue.js
new code Boy10 小时前
escape谨慎使用
前端·javascript·vue.js
奶球不是球10 小时前
elementplus组件中el-calendar组件自定义日期单元格内容及样式
javascript·css·css3