Как мне избежать цветового символа (:) внутри пути с помощью React-Router V4?

Question

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

/foo/bar/main:home
/foo/bar/main:about_us
/foo/bar/main:contact_us

Как вы видите, у меня есть : в URL-адресе, который необходимо принять во внимание.Я хочу сопоставить компонент Home с /foo/bar/main:home, но любой другой путь /foo/bar/main:XXXXX с компонентом По умолчанию .

Что я пробовалдо сих пор:

<Route path={'/foo/bar/main:home'} component={Home} />
<Route path={'/foo/bar/main:any'} component={Default} />

Это соответствует компоненту Home все время.

<Route path={'/foo/bar/main%3Ahome'} component={Home} />
<Route path={'/foo/bar/main:any'} component={Default} />

Теперь значение по умолчанию постоянно совпадает.Любая помощь будет оценена.Спасибо.

Answer 1

React-маршрутизатор использует path-to-regexp.Так что, чтобы избежать : Я думаю, что это будет работать:

/foo/bar/main\\:contact_us