向路由組件傳遞參數(shù)的幾種方式

  1. params參數(shù)
    路由鏈接(攜帶參數(shù))：<Link to='/demo/test/tom/18'}>詳情</Link>
    注冊(cè)路由(聲明接收)：<Route path="/demo/test/:name/:age" component={Test}/>
    接收參數(shù)：this.props.match.params

  2. search參數(shù)
    路由鏈接(攜帶參數(shù))：<Link to='/demo/test?name=tom&age=18'}>詳情</Link>
    注冊(cè)路由(無(wú)需聲明，正常注冊(cè)即可)：<Route path="/demo/test" component={Test}/>
    接收參數(shù)：this.props.location.search
    備注：獲取到的search是urlencoded編碼字符串，需要借助querystring解析

  3. state參數(shù)
    路由鏈接(攜帶參數(shù))：<Link to={{pathname:'/demo/test',state:{name:'tom',age:18}}}>詳情</Link>
    注冊(cè)路由(無(wú)需聲明，正常注冊(cè)即可)：<Route path="/demo/test" component={Test}/>
    接收參數(shù)：this.props.location.state
    備注：刷新也可以保留住參數(shù)

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容