Как два гнезда правильно реагируют на маршрут?

#reactjs #react-router

Вопрос:

 import { Route,  BrowserRouter as Router, Switch } from 'react-router-dom'

<Router weId={`${this.props.weId || ''}_wfcgvw`} basename={`${parentPath}/e10`}>
          <Route weId={`${this.props.weId || ''}_1jvdgd`} exact path={`/index`} component={ME10Index} />
          <Route weId={`${this.props.weId || ''}_1jvdgd`} path={`/invoice`} component={ME10Invoice} />
          <Route weId={`${this.props.weId || ''}_1jvdgd`} path={`/statistic`} component={ME10Statistic} />
          <Route weId={`${this.props.weId || ''}_cg92wc`} exact path={'/mine'}component={ME10Mine} />
          <Route weId={`${this.props.weId || ''}_cg92wc`} exact path={'/mine/mail'} component={ME10MailSetting} />
</Router>
 

Как вы видите, у меня есть такой маршрутизатор, я хочу оптимизировать эту часть:

От

 <Route weId={`${this.props.weId || ''}_cg92wc`} exact path={'/mine'}component={ME10Mine} />
<Route weId={`${this.props.weId || ''}_cg92wc`} exact path={'/mine/mail'} component={ME10MailSetting} />

 

Для

 <Route weId={`${this.props.weId || ''}_ucqhv6`} path="/mine">
            <Route weId={`${this.props.weId || ''}_cg92wc`} path={''}component={ME10Mine} />
            <Route weId={`${this.props.weId || ''}_cg92wc`} path={'mail'} component={ME10MailSetting} />
</Route>

 

Короче говоря, я хочу сделать маршрут кратким и включить вложенную информацию. Как это сделать? Спасибо.

Комментарии:

1. Ты имеешь в виду вот так ?

2. @Taxel Я прочитал этот пост. На данный момент я сталкиваюсь с проблемой, что маршрут работает неправильно, когда я их размещаю. Я отправил свой код.

3. Вам нужны <Switch> элементы вокруг нескольких маршрутов