React Native中的URI与URL

时间:2018-05-09 08:59:21

标签: url react-native uri webaddress

在本地反应中可以做到:

all target

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

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

问题

  1. const somePath = 'https://...' <Image source={{uri: somePath}} /> 作为网址提供网址相关的潜在问题是什么?
  2. 将网址作为URI提供给source有哪些潜在问题?

  3. 将图像地址提供给source的哪种方法更准确,更安全,更具前瞻性?

1 个答案:

答案 0 :(得分:4)

您提供的第一个代码示例无效

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

一般情况下,你应该使用源道具来提供像这样的本地图像

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