react 多个html,reactjs – 使用React-Router,每页有一个布局页面或多个组件

如果我正确理解你，实现你将在你的Route中定义多个组件。你可以使用它像(

example from the docs)：

// think of it outside the context of the router,if you had pluggable

// portions of your `render`,you might do it like this

,sidebar: }}/>

// So with the router it looks like this:

const routes = (

)

class App extends React.Component {

render () {

const { main,sidebar } = this.props;

return (

{main}

{sidebar}

)

}

}

class Users extends React.Component {

render () {

return (

{/* if at "/users/123" `children` will be */}

{/* UseRSSidebar will also get as this.props.children,so its a little weird,but you can decide which one wants

to continue with the nesting */}

{this.props.children}

)

}

}

编辑：

根据@ Luiz的评论：

In the latest version of router the components are in the root of the props object

所以：

const { main,sidebar } = this.props.children;

变为：

const { main,sidebar } = this.props;