В официальных документах React router 4 есть такой пример для вложенного маршрута
const App = () => (
<BrowserRouter>
{/* here's a div */}
<div>
{/* here's a Route */}
<Route path="/tacos" component={Tacos}/>
</div>
</BrowserRouter>
)
// when the url matches `/tacos` this component renders
const Tacos = ({ match }) => (
// here's a nested div
<div>
{/* here's a nested Route,
match.url helps us make a relative path */}
<Route
path={match.url + '/carnitas'}
component={Carnitas}
/>
</div>
)
Мой вопрос: я думаю, я мог бы добиться того же эффекта, используя такую настройку (вместо того, чтобы поместить Carnitas
в компонент Tacos
,записать его прямо рядом с Tacos
)
const App = () => (
<BrowserRouter>
{/* here's a div */}
<div>
{/* here's a Route */}
<Route path="/tacos" component={Tacos}/>
<Route
path={'tacos/carnitas'}
component={Carnitas}
/>
</div>
</BrowserRouter>
)
// when the url matches `/tacos` this component renders
const Tacos = ({ match }) => (
// here's a nested div
<div>
</div>
)
Каково ограничение второго подхода по сравнению с первым?