我々はすでに動的コンポーネントを選択してレンダリングする方法を知っている:react-router-domの動的コンポーネントを<Route>に与えることは可能ですか?
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を使用していますが、残念ながらこれを試しましたが動作しません。 – Carr
実際に単純なタイプミスがあると思います この行 '' 'var TargetComp = componentSet [compa];' 'は、compaがどこでも変数として定義されていないため、隠すコードがなければエラーを返します...したがって、componentSet [compa]はnullを返すcomponentSet [undefined]を評価する可能性が高いです。それを 'componentSet [type]'に変更してください –
ありがとう、ただ修正します!しかし、ここに示した例を入力するだけです。 – Carr