[react-router] React-Router怎么获取URL的参数？

  • 通过params
    • 类组件：在保证props能获取到路由信息的前提下（如果不是直接嵌套在<Route/>下，需要使用withRouter的HOC），通过this.props.match.params获取
    • 函数式组件：const params = useParams();
  • 通过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'}

个人简介

我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，
但坚持一定很酷。欢迎大家一起讨论















主目录

与歌谣一起通关前端面试题