[react-router] React-Router怎么获取URL的参数?
- 通过params
- 类组件:在保证props能获取到路由信息的前提下(如果不是直接嵌套在
<Route/>
下,需要使用withRouter
的HOC),通过this.props.match.params
获取 - 函数式组件:
const params = useParams();
- 类组件:在保证props能获取到路由信息的前提下(如果不是直接嵌套在
- 通过search,demo如下:
// query传参
this.props.history.push({pathname: 'list',search: qs.stringify({a: 123,}),
})
// 取值
import qs from 'qs';
// 类组件中取值
const paramStr = this.props.location.search.slice(1);
qs.parse(paramStr); // {a: '123'}
// 在函数式组件中取值
const location = useLocation();
const paramStr = location.search.slice(1);
qs.parse(paramStr); // {a: '123'}
个人简介
我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易,
但坚持一定很酷。欢迎大家一起讨论
主目录
与歌谣一起通关前端面试题