react-native-android - 在 Flatlist 项目上实现 onPress

Question

我试图在单击并设置为另一个类时发送平面列表项的数据。ontouch 正在工作，但我在图像中出现以下错误。另外如何将api的数据发送到另一个类并从另一个类获取？我已经实现如下：

export default class FlatSpeakers extends Component {

constructor(props) {
    super(props);
    this.state = { isLoading: true, data: [],selectedItem: null, }
   const { navigate } = this.props.navigation;
}

onPressItem = () => {
  navigate('SpeakersClick')
};

componentDidMount() {
    axios.get('https://rallycoding.herokuapp.com/api/music_albums')
        .then(res => {
            this.setState({
                isLoading: false,
                data: res.data,
            })
        })
}

renderItem({ item }) {
    return (
        <TouchableOpacity onPress={()=>this.onPressItem(item)} >
            <Card>
                <CardSection>
                    <View style={styles.thumbnailContainerStyle}>
                        <Image
                            style={styles.thumbnailStyle}
                            source={{ uri: item.image }}
                        />
                    </View>
                    <View style={styles.headerContentStyle}>
                        <Text style={styles.headerTextStyle}>{item.title}</Text>
                        <Text>{item.artist}</Text>
                    </View>
                </CardSection>
            </Card>
        </TouchableOpacity>
    )
}

render() {
    if (this.state.isLoading) {
        return (
            <View style={{ flex: 1, padding: 20 }}>
                <ActivityIndicator />
            </View>
        )
    }

    return (
            <View style={styles.container}>
                <FlatList
                    data={this.state.data}
                    renderItem={this.renderItem}
                    keyExtractor={(item, index) => index}
                    onPress={this.onPressItem}
                />
            </View>

    );
}
}

标签： react-native-androidreact-native-flatlist

Answer 1

this.onPressItem = this.onPressItem.bind(this)试着穿上constructor(props)