reagiere native Komponente, die als Requisiten weitergegeben wurde, kann nicht auf Requisiten zugreifen?

Question

In meinem Verständnis React native Komponenten haben zwei Möglichkeiten

· vorbei innen Eltern-Tag

· gerendert werden vorbei als Eltern (?) Requisiten

Zum Beispiel habe ich diese FlatList Komponente

haben

<FlatList 
     ListHeaderComponent={MiddleRightLabelComponent} 
     ItemSeparatorComponent={SeparatorComponent} 
     data={this.state.dataSource} 
     keyExtractor={item => item.title} 
     // renderItem={({ item }) => <Text>{item.key}</Text>} 
     renderItem={this._renderItem} 
     style={styles.flatlist} 
     {...this.props} 
/> 
_renderItem({ item, index }) { 
    console.warn(this.props); 
    return (
     <ListItem 
     id={item.id} 
     // onPressItem={this.props.openEditTaskModal.bind(this, true)} 
     // selected={!!this.state.selected.get(item.id)} 
     title={item.title} 
     /> 
    ); 
} 

In dieser _renderItem console.warn bekomme ich (undefiniert), wenn ich versuche (this.props).

Ich muss Requisiten in ListItem-Komponente übergeben.

Irgendeine Idee?

Answer 1

_renderItem erstellt eine eigene Instanz von this. In staatenlos Komponenten (oder Funktionen nicht zur Komponentenklasse gebunden) möchten Sie die Funktion params directy

const _renderItem = (props) => { 
    console.warn(props); 
    return (
     <ListItem 
     id={props.item.id} 
     title={props.item.title} 
     /> 
    ); 
} 

OR (mit es6 Destrukturierung) verweisen:

const _renderItem = ({ item }) => { 
    console.warn(item); 
    return (
     <ListItem 
     id={item.id} 
     title={item.title} 
     /> 
    ); 
}