ネイティブフラットリストに返すrenderItem

Question

Reactネイティブの操作、FlatListコンポーネントに問題があります。 これは、これは私のRenderItem機能である私のFlatList

<FlatList 
    data={this.state._data} 
    renderItem={() => this.renderItem()} 
    refreshControl={ 
     <RefreshControl 
     onRefresh={() => this.handleRefresh} 
     refreshing={this.state.refreshing} 
     /> 
     } 
    /> 

です：たonPressで

renderItem({item, index}) { 
    return (
     <View style={{marginTop: 10, marginHorizontal: 10, paddingLeft: 
     10}}> 
     <ListItem 
      roundAvatar 
      title={`${item.itemName}`} 
      subtitle={`${item.amount}`} 
      avatar={require('../../../images/logo.png')} 
     /> 
     <View 
      style={{ 
       paddingBottom: 10, 
       paddingTop: 10, 
       display: 'flex', 
       flexDirection: "row", 
       justifyContent: "space-around", 
       alignContent: "center" 
      }} 
     > 
      <View style={{ flexDirection: "row", alignContent: 
       "center", width:"45%"}}> 
       <Button 
        block 
        small 
        // disabled={this.state.acceptButtonGray} 
        style= 
         {this.state.acceptButtonGray ? ({ 
         backgroundColor: 'gray', 
         width: "100%" 
         }) : ({backgroundColor: "#369ecd", 
         width: "100%" 
         })} 
        onPress={() => 
         this.setState({ 
         modalVisible: true, 
         // acceptOrDeclineModalText: `Accept offer for ${item.amount} ${'\b'} Are you Sure?`, 
         acceptOffer: true, 
          }) 
         } 
         > 
        <Text> 
         Accept 
        </Text> 
       </Button> 
      </View> 
     </View> 
    </View> 
    ); 
    } 

this.setStateボタンには、モーダルを見えるようにし、trueにacceptOfferを設定する必要があります。モーダルが開き、ユーザーはオファーを確認します。そのモーダルを開いたオファーボタンは、グレーで、さらには無効にする必要があります。上記のように、私のRenderItem機能を渡す

が、私はこのように私のRenderItem機能を渡す

TypeError: Cannot read property 'item' of undefined. 

を受け取る：

renderItem={this.renderItem} 

私はこのエラーを取得：

_this2.setState is not a function 

FlatListコンポーネント確かに私の問題の一部、そしてどのように私がthisと呼んでいるかについても責任がある.setStatus食べた。私のポストには1つのボタンしか表示されていませんが、2つあります.1つは受け入れ、もう1つは辞退です。 2つのモーダルが何か変わるでしょうか？

FlatListは、ListItemを含むView内のボタンでthis.setStateを呼び出すまで、簡単にListItemコンポーネントを表示します。

モーダルクローズボタンはthis.state.acceptOfferを受け取り、trueの場合、this.state.acceptButtonGrayをtrueに設定します。このロジックは別の場所にある必要がありますか？

コンポーネントの状態を使用せずにモーダルを開き、ボタンの色を変更する別の方法はありますか？反応するとTouchableOpacityの中にこれらのボタンが必要ですか？

何か助けていただければ幸いです。

Answer 1

あなたはrenderItem={this.renderItem.bind(this)}に変更しようとしましたか？

Answer 2

あなたは私はあなたがピュアコンポーネントでFlatListを使用することをお勧めします。この

renderItem = ({item, index}) => { 
// return here 
}