是否可以<Route>在 react-router-dom 中提供动态组件?



我们已经知道如何动态挑选和渲染组件:

import CompA  from './CompA';
import CompB  from './CompB';
var componentSet = {
'compa': CompA,
'compb': CompB
}
var type = 'compa' 
var TargetComp = componentSet[type];
...
return <TargetComp /> 

但是在尝试将其与<Route>组件集成时,我没有成功:

class DynamicRoute extends Component {
render() {
return (
<Route path="/compa" render={()=> <TargetComp /> }/>
);
}
}
// Error message:
// Content.render(): A valid React element (or null) must be returned.- 
// You may have returned undefined, an array or some other invalid object.

感谢任何帮助!

这是针对 v4 的吗? 我通常使用组件属性而不是渲染。这行得通吗?

<Route path="/compA" component={TargetComp}/>

如果要访问通过Route渲染的组件中的路由属性(例如matchlocationhistory,例如组件代码中的this.props.history),则可以通过以下方式将props传递到组件中:

<Route path="/compA" component={(props) => (<compA {...props} myProp={this.state.myProp} />) } />

相关内容

  • 没有找到相关文章

最新更新