react-router：如何根据子节点配置布局组件？

Question

我有一个Application全局组件，我想根据当前路径进行配置，如下所示：

function getComponentProps(path) {
  if (path === '/') return { className: 'bg-grey-200' }
  if (path === '/statistics')  return { title: 'Last views' }
  return {}
}

export default class Application extends React.Component {
  render() {
    const config = getComponentProps(this.props.location.pathname)
    return {
      <div className={config.className}>
        {config.title && <h1>{config.title}</h1>}
        { this.props.children }
      </div>
    }
  }
}

const routes = (
  <Provider store={store}>
    <Router history={history}>
      <Route component={Application}>
        <Route path='/' component={Dasboard} />
        <Route path='statistics' component={Statistics} />
      </Route>
    </Router>
  </Provider>
)

这是正确的方法吗？或者你们都是这样做的？我知道我可以在儿童组件上做到这一点，但我想要更加干燥;）

感谢您的帮助！