Question

我正在尝试检索<Image>中React Native组件的图像数据。

问题是API我从有时没有图像源的地方获取数据。因此，我有这段代码来检查source.uri是否不为空，如果图像是将替换为我在项目中保存的图像。问题是，当source.uri为null时，我的图像不会出现，而是有一个空白。

import noImage from '../assets/noImage.jpg'
render()
{
    return (
        <Image
            style={{ width: SCREEN_WIDTH / 3, height: 13 }}
            borderRadius="10"
            resizeMode="stretch"
            source={item.restaurant.thumb ? { uri: item.restaurant.thumb } : { noImage }} />
    );
}

Answer 1

您可以尝试一下。

render(){
    return(
        <Image style={{width:SCREEN_WIDTH/3, height:130}} borderRadius="10" resizeMode="stretch" source={item.restaurant.thumb ? {uri: item.restaurant.thumb} : require('../assets/noImage.jpg')}}/>
)}

+ require('../assets/noImage.jpg')

-import noImage from '../assets/noImage.jpg'

-{noImage}

Answer 2

我猜您的“ noImage”不是网络链接，因此您需要使用require

source={item.restaurant.thumb ? {uri: item.restaurant.thumb} : require('path/noImage.png'})}

React Native图像源未显示

2 个答案: