javascript React Native上未显示简单图像URL

px9o7tmv  于 2023-05-05  发布在  Java
关注(0)|答案(2)|浏览(118)

我不明白为什么来自以下地址的图像不能在React Native上显示:
网址:https://firebasestorage.googleapis.com/v0/b/desire-app-e9e94.appspot.com/o/profile%2Fguest-user.webp?alt=media&token=fe99fdf9-d36a-4548-b295-cc2fdce79f64
url是通过firebase存储功能生成的,如果在浏览器中输入url就能正确显示,但我不明白为什么在image组件内部不显示
我的代码:

<Image
      source={{
        uri: 'https://firebasestorage.googleapis.com/v0/b/desire-app-e9e94.appspot.com/o/profile%2Fdefault_user.svg?alt=media&token=cd6fed4a-86da-4c52-bad7-7f8f0d83fd3a',
      }}
      style={{width: 200, height: 200}}
/>

有谁能告诉我原因吗?

ut6juiuv

ut6juiuv1#

显示webp镜像需要安装webp包。
运行以下2个命令,然后您应该能够显示图像。

npm install --save react-native-webp

react-native link react-native-webp
flseospp

flseospp2#

<Image
      source={{
        uri: 'https://firebasestorage.googleapis.com/v0/b/desire-app-e9e94.appspot.com/o/profile%2Fdefault_user.svg?alt=media&token=cd6fed4a-86da-4c52-bad7-7f8f0d83fd3a',
      }}
      style={{width: 200, height: 200}}
/>

您在此源中保存的url与您提到的不一样,您的url在〈Image标签中不正确,复制并粘贴正确的url,您的图像将显示,
试试这个

<Image
      source={{
        uri: 'https://firebasestorage.googleapis.com/v0/b/desire-app-e9e94.appspot.com/o/profile%2Fguest-user.webp?alt=media&token=fe99fdf9-d36a-4548-b295-cc2fdce79f64',
      }}
      style={{width: 200, height: 200}}
/>

相关问题