javascript - React Native - 图像组件不接受源 URI 属性的变量

Question

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

我正在渲染的子组件的代码如下:

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 prop 存在于 return 之前称呼。一切都表明数据库调用中已经存在 URL(即 image 属性)。

顺便说一句，我最初使用的是 react-native 的 ListItem组件并将其传递给 image Prop 作为它的 avatar属性;同样的问题发生在图像没有出现的地方，只是一个灰色的盒子。这也可以通过设置以下内容来解决:
avatar={'test URL here'}

Answer 1

我们是否 100% 确定 image是一个字符串？因为它在对 url 进行硬编码时起作用，也许 image prop 不是严格意义上的字符串