React 如何向url中添加参数
目录
React 向url中添加参数
React 获取url后面参数的值
React 向url中添加参数用@withRouter修饰组件，把不是通过路由切换过来的组件中，将react-router 的 history、location、match 三个对象传入props对象上
使用queryString去序列化需要添加的参数：
queryString.stringify({
name:liff,
id:1111
})
// return name=liff&id=1111
在props中获取history，并且把序列化的后的参数push进去
import queryString from "query-string";
import {withRouter} from "react-router-dom";
history.push({
queryString.stringify({
name:liff,
id:1111
})
})
React 获取url后面参数的值
由于页面跳转需要取携带的token访问数据。
写一个公共方法
export function getUrlToken(name, str) {
const reg = new RegExp(`(^|&)${ name}=([^&]*)(&|$)`);
const r = str.substr(1).match(reg);
if (r != null) return decodeURIComponent(r[2]); return null;
}
在要获取值得页面进行引入
import { getUrlToken } from '写你建立公共方法的地址';
// 结果测试
constructor(peops){
super(peops);
const token = getUrlToken ('token',peops.location.search);
console.log(token );
}
测试结果
以上为个人经验，希望能给大家一个参考，也希望大家多多支持软件开发网。
相关文章
Yasmin
2021-05-01
Hope
2021-03-01
Malina
2023-07-19
Bunny
2023-07-20
Willow
2023-07-20
Crystal
2023-07-20
Jacinda
2023-07-20
Viridis
2023-07-20
Nova
2023-07-20
Beth
2023-07-20
Viridis
2023-07-20
Georgia
2023-07-20
Shaine
2023-07-20
Isleta
2023-07-20
Jacinda
2023-07-20
Bree
2023-07-20
Kathy
2023-07-20
Lida
2023-07-21