Exploring the concept of dynamically picking and rendering components:
import CompA from './CompA';
import CompB from './CompB';
var componentSet = {
'compa': CompA,
'compb': CompB
}
var type = 'compa'
var TargetComp = componentSet[type];
...
return <TargetComp />
However, encountered a roadblock when attempting to combine it with the <Route> component:
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.
Any assistance on this matter would be greatly appreciated!