URI vs URL in React Native

落花浮王杯 提交于 2021-02-10 12:00:16

问题


In react-native one can do:

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

or

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

From what I understand about web addresses is that URIs are a superset of URLs and URNs.

Questions

  1. What are the potential problems associated with supplying a web address to source as a URL?
  2. What are the potential problems associated with supplying a web address to source as a URI?

  3. Which method of supplying an address of an image to source is more accurate, safer, and future proof?


回答1:


The first code example you provided won't work

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

In general general you should use the source prop to provide a local image like so

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

and the uri to display a remote image like so

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

You can also use the uri to display base64 image data

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

Read more about it in the documentation

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



来源:https://stackoverflow.com/questions/50249353/uri-vs-url-in-react-native

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!