使用React Router从url获取参数值

时间:2018-04-05 09:11:05

标签: javascript reactjs api url react-router-v4

我想从此React路由器获取id值:

<BrowserRouter basename="/api">
    <Switch>
        <Route path="/pm" exact component={PaymentMethod}/>
        <Route path="/pw" exact component={PaymentWeb}/>
        <Route path="/rg" exact component={Registrasi}/>
        <Route path="/bonus/:id" exact component={BonusScreen}/>
        <Route path="/hb" exact component={HistoryBonus}/>
    </Switch>
</BrowserRouter>

在我的BonusScreen中,我尝试使用以下方法打印该值:

const userId = this.props.match.id;
console.log(this.userId);
从浏览器

我尝试访问这样的URL:

bonus/NGO628567652201

但它总是返回undefined
我该如何解决这个问题?

2 个答案:

答案 0 :(得分:5)

如果有人遇到此问题。 正确的是:

const userId = this.props.match.params.id;

答案 1 :(得分:1)

您可以尝试

const id = this.props.computedMatch.params.id