URI vs URL in React Native

Question

在 react-native 中可以做到：

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

或

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

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

问题

1. 将网址作为 URL 提供给source有哪些潜在问题？

2. 将网址作为 URI 提供给source存在哪些潜在问题？

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

Answer 1

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

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