Question

我正在尝试在我的React-native应用程序中显示Firebase存储中的图像。我通过此async函数获得下载URL：

async function getImage() {
  const url = await storage()
  .ref('garnele.jpg')
  .getDownloadURL()
  console.log(url)
  return url
}

我的问题是如何将URL传递到图像组件。我尝试过：

<Image
    source={{uri: getImage() }}
 />

但是它只返回对象。

我还找到了getImage().then(result => console.log(result))-但我不知道该如何使用它。

Answer 1

这可能不是更干净的解决方案，因为我仍在学习 react native 和 firebase 产品，但是，这是我所做的：

import storage from '@react-native-firebase/storage';

@react-native-firebase 和 doc

const [imageUrl, setImageUrl] = useState(undefined);

useEffect(() => {
    storage()
      .ref('/' + 'FA984B65-38D4-44B1-BF02-4E7EF089773B.jpg') //name in storage in firebase console
      .getDownloadURL()
      .then((url) => {
        setImageUrl(url);
      })
      .catch((e) => console.log('Errors while downloading => ', e));
  }, []);

return (
    <Image style={{height: 200, width: 200}} source={{uri: imageUrl}} />
);

如何在React-native中显示Firebase存储中的图像？

1 个答案: