Как сопоставить неоднозначный путь и статический путь с React Router

Question

В настоящее время я пытаюсь найти следующий URL

https://www.example.com/discover/exampleuser/review

есть и другие URL-адреса, с которыми я также сопоставляю регулярное выражение

https://www.example.com/discover/community
https://www.example.com/discover/reviews
https://www.example.com/discover/activity

У меня есть следующий код, который будет соответствоватьпоследние три URL отлично

<Route path={`${url}/(community|reviews|activity)`} render={prop => (
  <div className='mb-4'>
    <CollectionWidget { ...prop } />
  </div>
)} />

Всякий раз, когда я использую следующий путь, он работает

{`${url}/:username`}

, однако, когда я пытаюсь сопоставить все URL, как это не так

{`${url}/(community|reviews|activity|:username)`}

Как сопоставить регулярное выражение с неоднозначным идентификатором

Answer 1

Это звучит невозможно, если честно, как вы можете сопоставить как безымянный, так и именованный параметр одновременно?

Хорошо, что вы можете передать в 2 строки (или больше):

<Route 
  path={[
    `${base}/(a|b|c)`, 
    `${base}/:username
  `]} 
  component={({ match }) => <div children={JSON.stringify(match.params)} />} />

// /b ---> { 0: "b" }
// /c ---> { 0: "c" }
// /d ---> { "username": "d" }