Несколько параметров с React Router

Я использую React 15.0.2 и React Router 2.4.0. Я хочу передать несколько параметров на свой маршрут, и я не уверен, как это сделать наилучшим образом:

<Route name="User" path="/user" component={UserPage}>   
    <Route name="addTaskModal" path="/user/manage:id" component={ManageTaskPage} />
</Route>

И что нужно - это что-то вроде:

 <Route name="User" path="/user" component={UserPage}>  
    <Route name="addTaskModal" path="/user/manage:id:type" component={ManageTaskPage} />
</Route>

Ответы

Ответ 1

Как упомянул @alexander-t:

path="/user/manage/:id/:type"

Если вы хотите оставить их необязательными:

path="/user/manage(/:id)(/:type)"

React Router v4

React Router v4 отличается от v1-v3, и необязательные параметры пути явно не определены в документации.

Вместо этого вы должны указать параметр пути, который понимает path-to-regexp. Это обеспечивает большую гибкость в определении ваших путей, таких как повторяющиеся шаблоны, подстановочные знаки и т.д. Поэтому, чтобы определить параметр как необязательный, вы добавляете конечный знак вопроса (?).

Итак, чтобы определить необязательные параметры, вы можете сделать:

path="/user/manage/:pathParam1?/:pathParam2?"

т.е.

<Route path="/user/manage/:pathParam1?/:pathParam2?" component={MyPage} />

Принимая во внимание, что в V4 обязательные параметры все те же:

path="/user/manage/:id/:type"

Чтобы получить доступ к значению PathParam, вы можете сделать:

this.props.match.params.pathParam1

Ответ 2

Для необязательных полей параметров по какой-то причине он отлично работает без косой черты перед двоеточием внутри фигурных скобок(). React-router 2.6x

Ответ 3

Попробуй это

<Route name="User" path="/user" component={UserPage}>  
  <Route name="addTaskModal" path="/user/manage/:id/:type" component={ManageTaskPage} />
</Route>