Question

我通过绑定数组实现了一个平面列表组件。当我点击一个项目。我必须得到项目名称或Id。

 _renderList = ({ item }) => {
    return (
        <View style={styles.listContainer} onPress={this._selectedItem(item.text)}  >
            <Image style={styles.listImage} source={item.avatar} />
            <Text style={styles.listText} >{item.text}</Text>
            <Text style={styles.listVal} >{item.val}</Text>
            <Image style={styles.listImage}   source={require('../../resources/icons/MyAccount/arrowright.png')} />
        </View>
    );

}


<FlatList data={this.state.data} renderItem={this._renderList} />

Answer 1

考虑@SNT答案和bennygenel评论。我添加了这个。回答他们的建议需要注意。

 _renderList = ({ item }) => {
    return (
     <TouchableWithoutFeedback onPress={(event)=>this._selectedItem(item.text)}>
        <View style={styles.listContainer}>
            <Image style={styles.listImage} source={item.avatar} />
            <Text style={styles.listText} >{item.text}</Text>
            <Text style={styles.listVal} >{item.val}</Text>
            <Image style={styles.listImage}   source={require('../../resources/icons/MyAccount/arrowright.png')} />
        </View>
     </TouchableWithoutFeedback>
    );

}


<FlatList data={this.state.data} renderItem={this._renderList} />

Answer 2

您可以使用TouchableOpacity，TouchableHighlitfor，TouchableWithoutFeedback onPress事件。 View未提供onPress道具。

 _renderList = ({ item }) => {
    return (
     <TouchableWithoutFeedback onPress={(item)=>this._selectedItem(item.text)}>
        <View style={styles.listContainer}>
            <Image style={styles.listImage} source={item.avatar} />
            <Text style={styles.listText} >{item.text}</Text>
            <Text style={styles.listVal} >{item.val}</Text>
            <Image style={styles.listImage}   source={require('../../resources/icons/MyAccount/arrowright.png')} />
        </View>
     </TouchableWithoutFeedback>
    );

}


<FlatList data={this.state.data} renderItem={this._renderList} />

获取FlatList中所选项的值。 - React Native

2 个答案: