在新发布的react-router 5.0中，route组件有三个支持组建渲染的属性，那我们到底该如何使用他们呢，今天就让我们详细的了解一下~
render
render属性能使你便捷的渲染内联组件或是嵌套组件，你可以给这个属性传入一个函数，当路由的路径匹配时调用。同时，render属性也会接受所有由route传入的所有参数。
//内联方式
<Route path="path" render={() => <div>这是内联组件写法</div>} />
//嵌套组合方式
<Route path="path" render={ props => (
<ParentComp>
<Comp {...props} />
</ParentComp>
) />
children
children属性是这三个属性中比较特殊的一个，它的值为一个函数，当Route有children属性时，不管当前的路径是否与Route匹配，该函数都会执行，同时，children属性也会接受所有由route传入的所有参数。
<Route path="path" children={ props => (
<div className={props.match? "active": ''}>
<Link to="path" />
</div>
) />
component
当你使用component属性时，router会通过你赋给该属性的值，使用React.createElement方法去创建一个新的React元素，这意味着如果你给component属性赋的值是一个内联函数，那他每次渲染都会创建一个新的组件，这会导致每次渲染都会伴随新组件的挂载和旧组件的卸载，而不是只是对已存在组件的更新操作。 所以当你要使用内联函数进行组件渲染时，使用render或children属性会更合适些。
const Comp = props => <div>{props.match.params.name}</div>
<Route path="path" component={Comp} />
注意
在使用Route的这三个属性渲染组件时还有一点值得注意，就是当这三个属性同时存在时的优先级问题，正常情况下我们基本上使用其中一个属性就可以了，但当他们同时存在时，优先渲染component的值，其次是render属性的值，而children属性的值优先级最低，为了避免 不必要的错误，尽量每个Route中只是用他们三个中的其中一个。
component > render > children
