2

我想动态地使图像出现在“ImageBackground”上。

我有一个 JSON 数据文件，其中包含图像的所有路径。

我使用 flatlist 来使用数据文件中的所有数据，并使用自定义组件来格式化我的可视化（集成为 flatist 上的项目）。

我的问题是，当我使用 JSON 文件中的数据时，我的图像没有出现，但是当我使用静态路径时，一切正常。

我究竟做错了什么？当我 console.log 我的 item.poster_path 正确发布。这可能是我在

source={{uri: item.poster_path}}

但我自己没有找到

// 助手/filmsData.js

export default data = [
   {
      id: 1,
      {...}
      poster_path: "../Images/photo1.jpg",
   },
   {
      id: 181809,
      {...}
      poster_path: "../Images/photo2.jpg",
      {...}
   }
]

// 自定义组件 Item import React from 'react'; 从 'react-native' 导入 { StyleSheet, Text, View, ImageBackground, Image, TouchableOpacity };

class test extends React.Component {

     render() {

         return (
             <TouchableOpacity
                 style={styles.item_content}
                 onPress={() => {(...)}}>

                 <ImageBackground
                     // source={require('../Images/photo1.jpg')} => Working OK
                     source={{uri: item.poster_path }} => Not Working
                     style={styles.ImageBackground}>
                     <View
                        {...}
                 
                     </View>

            </ImageBackground>

        </TouchableOpacity>

    );
}
}

const styles = StyleSheet.create({
    event_content: {
        height: 120,
        margin: 1
    },
     ImageBackground: {
         width: '100%',
         height: '100%'
    }
    })

 export default test
4

0 回答 0