反应原生 ImageBackground 未在 IOS 设备上显示答案

【问题标题】：react native ImageBackground not showing on IOS device反应原生 ImageBackground 未在 IOS 设备上显示
【发布时间】：2021-06-01 01:21:34
【问题描述】：

我正在使用 react native 的 ImageBackground 组件，但在 IOS（设备）中它不显示图像，在模拟器中出现图像这可能是什么？

代码如下：

import { ImageBackground } from 'react-native';

const imgSrc = require('../../assets/images/bg-login.png');

<ImageBackground
        resizeMode="cover"
        source={imgSrc}
        style={style.backgroundImage}
      >

样式如下：

backgroundImage: {
        width: screenWidth,
        height: '100%'
    },

【问题讨论】：

标签： ios image react-native react-native-image imagebackground

【解决方案1】：

您是否将 asset 文件夹添加到您的 iOS 版本中？

命令如下：

react-native bundle --minify --entry-file index.js --platform ios --dev false --bundle-output ./ios/main.jsbundle --assets-dest ./ios

您将在ios 文件夹中看到资产文件夹和main.jsbundle 文件。之后转到Xcode -> build phases -> copy bundle resources，然后添加asset 文件夹和main.jsbundle 文件。别忘了点击Copy if needed

【讨论】：

【解决方案2】：

render() {


    return (
    <View style={{ flex: 1 }}>
    <ImageBackground
            resizeMode="cover"
            source={require('../assets/oops.png')}
            style={{width:Dimensions.get('screen').width,height:Dimensions.get('screen').height}}
          >

      </ImageBackground>
      </View>
    );
  }

尝试此代码并根据您的要求使用 resizeMode

【讨论】：