从React-Native

Question

大家好，我目前正在开发应用程序，我必须获取图片的photo_path才能在屏幕上显示该图片。我试图通过创建const film = this.props.film来访问它，但是出现了这样的错误：

  

TypeError：未定义不是对象（正在评估“ film.photo_path”）。

奇怪的是，我可以访问它，并且可以在另一个组件中显示它，但我不能显示我想要的那个组件。我也用同样的方式称呼它。

这是代码。

filmData.js

export default data = [
   {
      id:1,
      name:"Irma",
      photo_path:"http://fr.web.img5.acsta.net/r_1920_1080/medias/nmedia/18/62/85/01/18821912.jpg",
      specialite: "jeu de carte",
      description:"Madame Irma est un personnage de fiction souvent dépeint sous les traits d'une diseuse de bonne aventure"
   },
   {
      id:2,
      name:"Baba",
      photo_path:"http://fr.web.img5.acsta.net/r_1920_1080/medias/nmedia/18/62/85/01/18821912.jpg",
      specialite: "jeu de carte",
      description:"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."

   }
]

FilmDetail.js

    import React from 'react';
    import { StyleSheet, View, TextInput, ScrollView, Button, Text, FlatList, ImageBackground, Image } from 'react-native';
    import { LinearGradient } from 'expo-linear-gradient';

    import MyButton from './MyButton';
    import films from '../Helpers/FilmData';
    import FilmItem2 from './FilmItem2';

    class FilmDetail extends React.Component {
      _displayDetailForFilm = (idFilm) => {
        console.log("Display film with id " + idFilm);
        this.props.navigation.navigate("FilmDetail", { idFilm: idFilm });
      }

      render() {

      const film = this.props.film;

        return (
          <View style={styles.view_container}>
            <ScrollView>
              <View style={styles.photo}>
                <ImageBackground source={{uri: film.photo_path}} style={{width: '100%', height: '100%'}}>
                  <View style={styles.photo_content}>
                    <LinearGradient colors={['transparent', 'rgba(0,0,0,0.9)']} style={{ position: 'absolute', left: 0, right: 0, bottom: 0, height: 80 }} />
                    <Text style={styles.nom}>Irma</Text>
                  </View>

                </ImageBackground>
              </View>
              <Text style={styles.specialite}>Médium pure</Text>
              <Text style={styles.description}>Mon don me permet de capter des messages précis au travers de mes flashs. Élevée par ma grand-mère avec qui j’ai exercé la voyance au quotidien pendant de nombreuses années. Je peux vous guider sur les points qui vous préoccupent et ressentir l’influence des gens qui vous entourent.</Text>
              <View style={{ flexDirection:'row', justifyContent: 'space-around' }}>
                <MyButton style={{}} text={"Voyance privée\nouvert 24h/24\n01 44 01 77 01"} icone='icone-transfert' onPress={() => { alert("Voyance privée"); }}/>
                <MyButton text={"Voyance sans CB\nouvert 24h/24\n32 32"} icone='icone-sonnerie' onPress={() => { alert("Voyance sans CB"); }}/>
              </View>
              <Text style={styles.titre}>Nos Professionnels{"\n"}de la Voyance</Text>
              <FlatList style={styles.flatList}
              horizontal
              data={films}
              keyExtractor={(item) => item.id.toString()}
              renderItem={({item}) => <FilmItem2 film={item} displayDetailForFilm={this._displayDetailForFilm} />} />
              <View style={{ flexDirection:'row', justifyContent: 'space-around', marginBottom: 35 }}>
                <MyButton text={"Je consulte"} icone='icone-sonnerie' onPress={() => { alert("Je consulte"); }}/>
              </View>
            </ScrollView>
          </View>
        )
      }
    }

export default VoyanteProfil

谢谢！