时间戳

首页 > 解决方案 > 反应原生图像不显示在android模拟器上

react-native - 反应原生图像不显示在android模拟器上

问题描述

下面是我的代码

<View style={{ flex: 1, backgroundColor: "#f1f5f7", alignItems: "center" }}>
      <ScrollView>
        <ImageBackground
          source={{
            uri:
              "https://mosfeed.id/assets/collections/ads/small/photo_2021-03-10%2016.38.26.jpeg",
          }}
          style={{
            width: screenWidth,
            height: 190,
            alignItems: "center",
            justifyContent: "center",
            paddingHorizontal: 50,
          }}
        ></ImageBackground>
        <ItemData title="Upcoming Events" data={DATA1} />
        <ItemData title="Premium" data={DATA2} />
      </ScrollView>
      <MaterialSnackbar ref={snackbarRef} />
    </View>

问题是图像仅显示在 android 模拟器上且仅来自我的服务器。但是当我从其他服务器链接更改链接时，图像显示。

是否有任何设置可以在我的服务器上显示图像。

谢谢

标签： react-native

解决方案

我通过以下方式实现了这一目标：

import { ImageBackground } from 'react-native';

<ImageBackground style={ styles.imgBackground } 
                 resizeMode='cover' 
                 source={require('./Your/Path.png')}>

   //place your now nested component JSX code here

</ImageBackground>

然后是样式：

imgBackground: {
        width: '100%',
        height: '100%',
        flex: 1 
},

推荐阅读