React native ReactNative-This.props在TouchableOpacity onPress（）中未定义

我正在尝试使用Stacknavigator，这个“Search.js”和“DetailFilm.js”上有两个组件 我的组件Search.js上有这个代码

import React from 'react';
import FilmItem from './FilmItem';
import films from '../Helpers/filmData';
import { getFilm } from '../API/TMDBApi';
import { StyleSheet, Text, View, Button, TextInput, FlatList, ActivityIndicator } from 'react-native';



class Search extends React.Component{

constructor(props){
    super(props)
    this.state = {
        films: [],
        isLoading: false
    }
    this.page = 0
    this.totalPage = 0
    this.searchedText = ''
}

_displayLoading(){
    if(this.state.isLoading){
        return(
            <View style={styles.loading_container}>
                <ActivityIndicator size="large" color="purple"/>
            </View>
        )
    }
}

_loadFilms(){
    this.setState({
        isLoading: true
    })

    if(this.searchedText.length > 0){
        getFilm(this.searchedText, this.page+1).then((data) => {
            this.page = data.page
            this.totalPage = data.total_pages
            this.setState({
                films:  [...this.state.films, ...data.results],
                isLoading: false
            })

        })
    }
}

_searchFilms(){
    this.page = 0
    this.totalPage = 0
    this.setState({
        films: []
    },() => {
        this._loadFilms()
    })

}

_searchInputText(text){
    this.searchedText =  text
}

_displayDetailForFilm(idFilm){
    console.log("idFilm: "+idFilm)
    console.log(this.props)
}

render(){
    console.log(this.state.isLoading)
    // console.log(this.props)
    return(

        <View style={styles.container}>
            <TextInput onSubmitEditing={() => this._searchFilms()} onChangeText={(text) => this._searchInputText(text)} style={ styles.inputStyle } placeholder="Titre du film" />
            <Button style={styles.btnStyle} title="Rechercher" onPress= {() => this._searchFilms()}/>

            <FlatList
                data={this.state.films}
                onEndReachedThreshold={0.5}
                onEndReached={() => {
                    if(this.state.films.length > 0 && this.page < this.totalPage){
                        this._loadFilms()
                    }
                }}
                keyExtractor={(item) => item.id.toString()}
                renderItem={({ item }) => <FilmItem film={item} displayDetailForFilm={this._displayDetailForFilm} />}
            />

            {this._displayLoading()}
        </View>
    )
}

}

有一个搜索电影的功能，这个功能运行得很好，但我想让“电影的更多信息”这样的功能由函数

\u displayDetailForFilm

表示，当按下其中一个数据（组件FilmItem上的数据）时使用该函数，在

视图

之前，我使用了

touchableopacity

因此，当按下touchableopacity时，在我的控制台上我会得到idFilm，并且在我的render on Search.js中的console.log会显示我控制台中的道具，但是当我在我的函数

\u displayDetailForFilm（）

中添加

console.log（this.props）

时，按下touchableopacity时会返回该错误：

“Undefined不是对象（评估'this.props'）”

我通过查看更改了

touchableopacity

，并通过

onStartShouldSetResponder

更改了

onPress

，在获得

id

后，我在控制台上显示了

未定义的

我在网上搜索了一下，但没有找到解决方案：（如果有人能帮助plz
很难完全理解代码，因为导入语句和道具都丢失了，也许你可以在这里添加一个完整的代码示例

根据您包含的代码，我猜Search.js中的
displayDetailForFilm
在另一个范围内（可能是搜索组件的范围），这是搜索元素（您也可以尝试
console.log（这个）
，顺便检查一下）。或者您没有正确地传递函数引用，并且根本没有作用域，但如果没有完整的代码，这很难猜测。您可以将道具作为第二个参数传递给
displayDetailForFilm
，但根据您实际想要实现的内容/您想要在该函数中包含的数据，可能有更好的选择。
这是一个问题It’很难完全理解代码，因为缺少导入语句以及道具传递，也许您可以在这里添加完整的代码示例

根据您包含的代码，我猜Search.js中的
displayDetailForFilm
在另一个范围内（可能是搜索组件的范围），这是搜索元素（您也可以尝试
console.log（这个）
，顺便检查一下）。或者您没有正确地传递函数引用，并且根本没有作用域，但如果没有完整的代码，这很难猜测。您可以将道具作为第二个参数传递给
displayDetailForFilm
，但根据您实际想要实现的内容/您想要在该函数中包含的数据，可能有更好的选择

class FilmItem extends React.Component{

constructor(props){
    super(props)

}

render(){
    // const film = this.props.film
    // const detail = this.props.displayDetailForFilm
    const { film, displayDetailForFilm } = this.props
    return(
        <View onStartShouldSetResponder={() => displayDetailForFilm(film.id)} style={styles.container}>

                <Image 
                    style={styles.film_pic}
                    source={
                        {uri: getImageFromApi(film.poster_path)}
                    }
                />

            <View style={styles.film_info}>
                <View style={styles.title_vote}>
                    <Text style={styles.film_title}>{film.title}</Text>
                    <Text style={styles.film_vote}>{film.vote_average}</Text>
                </View>
                <View style={styles.film_description}>
                    <Text style={styles.film_detail} numberOfLines={6}>{film.overview}</Text>
                </View>
                <View style={styles.film_date}>
                    <Text style={styles.film_date_detail} >Sorti le {film.release_date}</Text>
                </View>
            </View>
        </View>
    )
}