小编Eli*_*Lee的帖子

父组件将通过数据库调用接收到的数据传递给子组件。

我正在呈现的子组件的代码如下：

import React, { Component } from 'react'
import { Image, View, Text } from 'react-native'

class ListItem extends Component {
  render () {
    const { name, image } = this.props.item

    return <View>
      <Image
        style={{ width: 50, height: 50 }}
        source={{ uri: image }} />
      <Text>
        {name}
      </Text>
    </View>
  }
}

export default ListItem

使用上面的代码，虽然 50 x 50 元素确实占用了空间（使用检查器看到），但没有显示图像。

被测试的 URL 工作正常，图像在硬编码时显示在应用程序中：

source={{ uri: 'test URL here' }}

我还习惯于在调用之前console.log检查该image道具是否存在return。一切都表明 URL（即imageprop）已经存在于数据库调用中。

附带说明一下，我最初使用的是 …