How to implement react router4 nesting?

in vue , you can nest child components anywhere in the parent component through < router-view / > , but how do you do it in react? Beginner react, ask for advice!

the following react Code
Layout.js 

import React from "react"

const Layout = () =>(
    <div>
        <div>header</div>
        
        
        
        <div>footer</div>
    </div>
)
export default Layout

ChildOne.js 

...
<div> 1</div>

ChildTwo.js 

...
<div> 2</div>

routing: 

<Router>
    <Fragment>
        <Route  path="/" component={Layout}/>
        <Route path="/one" component={ChildOne}/>
        <Route path="/two" component={ChildTwo}/>
    </Fragment>
</Router>
The

route is written so that the child components are only displayed at the end of the Layout component.

React.js
Apr.05,2021 
const Layout = (props) =>(
    <div>
        <div>header</div>
        
        {props.children}
       
        <div>footer</div>
    </div>
)

<Router>
    <Layout>
        <Route path='/one' component={ChildOne}/>
        <Route path='/two' component={ChildTwo}/>
    </Layout>
</Router>
import React from 'react'

const Layout = () =>(
    <div>
        <div>header</div>
        
        <ChildOne />
        {/*or*/}
        <Route path='/two' component={ChildTwo} />
        <div>footer</div>
    </div>
)
export default Layout

Previous: Use python selenium phantomjs to report an error when raspberry pie has no interface.

Next: Beginner redux, how to deal with this problem?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu