通过react-router用斜杠处理路径的方式是什么？

Question

我在使用react-router进行动态路由时遇到问题。我的示例路径如下所示：

/contacts/C/BG-DPC-063

这是我的路线：

<Route path='/contacts/:contactId' component={Contacts}/>

因此，当我尝试处理我的比赛时：

const {
    params: { contactId }
} = match;

由于斜杠

contactId只是'C'。我该如何处理？这是API的ID，因此我无法更改。

Answer 1

为什么不使用：

<Route path='/contacts/:contactPrefix/:contactSuffix' component={Contacts}/>

那你以后再合并吗？

Answer 2

这完全取决于URL的哪些部分是动态的？如果“ C”不是动态的

<Route path='/contacts/C/:contactId' component={Contacts}/>

否则

<Route path='/contacts/:apiID/:contactID' component={Contacts}/>

如果是第二种情况，请确保处理不存在的appID和/或contactID情况，因为用户可以输入对:appID和/或{{ 1}}中的网址（如果无效，请将其重定向到其他页面或显示一些消息）。