• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录
社会优先于个人
博客园    首页    新随笔    联系   管理    订阅  订阅
向路由组件传递参数
  1. params参数
  • 路由链接,携带参数
 <Link to={`/about/${this.state.id}`}>about</Link>
  • 注册路由,声明接受
<Route path='/about/:id' component={About}/>
  • 接受参数:this.props.match.params
  1. search参数
  • 路由链接,携带参数
 <Link to={`/about/?id=${this.state.id}&title=hehe`}>about</Link>
  • 注册路由,无需声明,正常注册即可
<Route path='/about' component={About}/>
  • 接受参数:this.props.location.search
  • 备注:获取到的search是urlencoded编码字符串,需要借助querystring解析
  1. state参数
  • 路由链接
 <Link to={{pathname:'/home',state:{id:'iloveyou'}}}>home</Link>
  • 注册路由,无需声明,正常注册即可
 <Route path='/home' component={Home}/>
  • 接受参数:this.props.location.state
  • 备注:刷新也可以保留住参数
posted on 2022-08-30 10:04  社会优先于个人  阅读(23)  评论(0)    收藏  举报
刷新页面返回顶部
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3