React Native中的URI与URL

Siy*_*iya 1 url uri webaddress react-native

使用本机可以做到:

const somePath = 'https://...'
<Image source={somePath} />
Run Code Online (Sandbox Code Playgroud)

要么

const somePath = 'https://...'
<Image source={{uri: somePath}} />
Run Code Online (Sandbox Code Playgroud)

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

问题

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

  3. 哪一种提供图像地址的方法source更准确,更安全和更可靠?

nee*_*eep 5

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

const somePath = 'https://...'
<Image source={somePath} />
Run Code Online (Sandbox Code Playgroud)

通常,您应该使用源道具来提供本地图像,例如

const someLocalImage = require("./assets/someImageName.png");
<Image source={someLocalImage} />
Run Code Online (Sandbox Code Playgroud)

和uri像这样显示远程图像

<Image source={{uri: "https://example.com/someRemoteImagePath.png" />
Run Code Online (Sandbox Code Playgroud)

您还可以使用uri显示base64图像数据

<Image
      source={{uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADMAAAAzCAYAAAA6oTAqAAAAEXRFWHRTb2Z0d2FyZQBwbmdjcnVzaEB1SfMAAABQSURBVGje7dSxCQBACARB+2/ab8BEeQNhFi6WSYzYLYudDQYGBgYGBgYGBgYGBgYGBgZmcvDqYGBgmhivGQYGBgYGBgYGBgYGBgYGBgbmQw+P/eMrC5UTVAAAAABJRU5ErkJggg=='}}
    />
Run Code Online (Sandbox Code Playgroud)

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

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