1

PrimeReact を使用してアプリケーションを開発しています。私の React コンポーネントの 1 つでReact.createElement、状態変数を使用して動的にコンポーネントを作成し、保存しています。次に、PrimeReact を使用して動的に作成されたコンポーネントをダイアログで表示しています。以下は、コンポーネントを作成するコードです。

let element;
element = React.createElement(MyComponent, { ...props } ); // props defined earlier
this.setState({
   dynamicComponent: element,
   dialogVisible: true
});

以下は、dynamicComponentダイアログに表示するコードです。

<Dialog header="Form" visible={this.state.dialogVisible} style={{ width: '50vw' }} modal={true}>
    {this.state.dynamicComponent}
</Dialog>

上記のコードは初回のみ動作します。次回別propsのを渡すと、以前のコンポーネントが引き続き表示されますprops。

私の質問は次のとおりです。

  1. コンポーネントが作成されるたびに、ダイアログに異なる小道具でコンポーネントを表示させるにはどうすればよいですか?
  2. これは私の問題にアプローチする正しい方法ですか? また、同じコンポーネントを異なる小道具でロードするだけでなく、異なるコンポーネントを完全にロードする必要があるように、ソリューションを拡張する必要もあります。
4

0 に答える 0