0

ボタンを使用していくつかのコンポーネントをレンダリングするネイティブ ベース コンポーネントをループしています。<Card dataArray={data} />それは問題なく動作していました（期待どおりにすべてのコンポーネントをリストしました）が、すぐonPressにボタンにイベントを追加し、自動onPressバグが発生しました。コンポーネントがそれらのボタンでレンダリングすることを想定しているのに、1回だけ実行されます（クリックすると、バインドされた関数が実行されます）。 .

//- Inside constructor I bind testLogs
this.testLogs = this.testLogs(this);

//- Outside render...
testLogs(value) {
  console.log(value);
}

//- Inside return of render()

<Card dataArray={devices}
  renderRow={(theme) => 
    <CardItem>
      {(theme.picture) ? 
        <Thumbnail size={100} source={theme.picture} />:
        <Thumbnail size={100} source={defaultImage} />
      }
      <Text style={{fontSize: 16}}> {theme.name} </Text>
      <Button primary style={{marginRight: 10}}> Command </Button>
      <Button success onPress={this.testLogs} > Edit </Button>
    </CardItem>
  }>
</Card>

onPress={this.testLogs}また、レンダリングされたすべてのコンポーネントは、レンダリング後にクリックしてもバインドされた関数を実行しないと言う必要があります。

何がこれを引き起こしている可能性がありますか? または、ループ レンダリングはこれに対する最善のアプローチではありませんか?

ありがとうございました。

4

1 に答える 1

2

onPress={this.testlogs.bind(this)} を使用

于 2016-12-12T20:20:43.300 に答える