FlatList項目の詳細をModalに渡すことができません

Question

FlatListがあり、詳細を見るために各FlatList項目をModalで開きたいとします。この例では、{rowData.data.display_name}をクリックして{rowData.data.display_name}をModalの内部に表示しようとしています。私はAPIからデータを取得します。私がModalを開くと、それは私がクリックした同じ項目ではありません。私はどのようにアイテムIDを設定してModal内の同じアイテムを見ることができないのでしょうか？どんな助けもありがとう！私の意見あなたはFlatList外でモーダルを置くべきで

<FlatList 
      data={this.state._data} 
      renderItem={({item: rowData}) => { 
      return (
       <View style={styles.container}> 

       <TouchableOpacity 
       onPress={this.openModal}> 
       <Text style={styles.title}> 
        {rowData.data.display_name} 
        </Text> 
       </TouchableOpacity> 

      <Modal 
      style={styles.modal} 
     ref={(modal) => this.modal = modal} 
       coverScreen={true} 
      swipeToClose={this.state.swipeToClose} 
      onClosed={this.onClose} 
      onOpened={this.onOpen} 
      onClosingState={this.onClosingState}> 
      <Text style={styles.text}>      
      {rowData.data.display_name} 
     </Text> 
     </Modal> 
      </View> 
      ); 
      }} 
      keyExtractor={(item, index) => index} 
     /> 

Answer 1

： はここに私のコードです。あなたがコード化したやり方では、リストの新しい項目が作成されるたびに "this.modal"を上書きします。

次に、Modalコンポーネント内のopenModal関数上のModal（おそらく状態経由）のテキストの変更を受け入れるだけで、renderItemでは、モーダルを表示するコンテナからの情報を渡すようにonPressを変更します。

  onPress={()=> this.openModal(rowData.data)}>