从 Firestore 中检索图像数组

Question

我进行了查询以从 Firestore 中获取特定文档的所有字段。其中一个字段是一组图像，取自 Firebase 存储。我不知道为什么，但我无法检索这些图像。

编辑：我试图在日志之后添加一个 abc，在图像之前，没有任何显示。

这是我的代码：

  const [photo, setPhoto] = useState([]);

  useEffect(() => {
      handlClick();
  }, []);

  const handlClick = () => {
    var i = 0;
    setRestaurant([]);
    setPhoto([]);
    db.doc(idBranch).get().then(data => {
        const branchData = data.data();
        setRestaurant(branchData);
        const ph = branchData.Photo;
        ph.forEach(pho =>{
          setPhoto(p => [...p, pho]);
        })
    })
  }

  return (
        {photo && photo.forEach((ph) => {
            <View>
              <Text> {console.log(ph)}</Text>
              <Image source = {{uri : ph}}/>
            </View>
        })}
  )

console.log 是正确的（即使它们每次被检索多次并且不应该这样做），这里是图像：

这里是 Firestore 结构：

请帮助我了解我应该如何检索图像。

Answer 1

您的功能组件必须 return JSX 但不是对象。如果你想通过循环渲染 JSX，你也必须使用 .map 方法。试试这个：

return (
   <View>
      {photo && photo.map((ph) => (
         <View>
            <Text>{console.log(ph)}</Text>
            <Image source = {{uri : ph}}/>
         </View>
         ))
      }
   </View>
)

从 Firestore 中检索图像数组

Retrieve array of images from Firestore

uri

image

firebase

react-native

google-cloud-firestore