2

在 react-native 中,可以这样做:

const somePath = 'https://...'
<Image source={somePath} />

或者

const somePath = 'https://...'
<Image source={{uri: somePath}} />

根据我对网址的了解,URI 是 URL 和 URN 的超集。

问题

  1. source将网址作为 URL提供相关的潜在问题是什么?
  2. 将网址source作为 URI 提供相关的潜在问题是什么?

  3. 哪种提供图像地址的方法source更准确、更安全且面向未来?

4

1 回答 1

7

您提供的第一个代码示例不起作用

const somePath = 'https://...'
<Image source={somePath} />

一般来说,您应该使用 source 道具来提供像这样的本地图像

const someLocalImage = require("./assets/someImageName.png");
<Image source={someLocalImage} />

以及像这样显示远程图像的uri

<Image source={{uri: "https://example.com/someRemoteImagePath.png" />

也可以使用uri显示base64图片数据

<Image
      source={{uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADMAAAAzCAYAAAA6oTAqAAAAEXRFWHRTb2Z0d2FyZQBwbmdjcnVzaEB1SfMAAABQSURBVGje7dSxCQBACARB+2/ab8BEeQNhFi6WSYzYLYudDQYGBgYGBgYGBgYGBgYGBgZmcvDqYGBgmhivGQYGBgYGBgYGBgYGBgYGBgbmQw+P/eMrC5UTVAAAAABJRU5ErkJggg=='}}
    />

在文档中阅读有关它的更多信息

https://facebook.github.io/react-native/docs/image.html#source

于 2018-05-09T12:01:34.630 回答