TypeError: urls.map 不是 React 中的函数答案

【问题标题】：TypeError: urls.map is not a function in ReactTypeError: urls.map 不是 React 中的函数
【发布时间】：2021-06-17 12:06:23
【问题描述】：

我必须在反应中显示图像时遇到问题。从 firebase 存储中获取的所有图像 url 列表。传递所有 url 显示图像显示 urls.map 不是函数

const ViewImages = () => {

var storageRef = firebase.storage().ref("images/");

const [image, setImage] = useState(""); const [urls, setFiles] = useState("");

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

useEffect(() => { const fetchImages = async () => {

let result = await storageRef.child('images1/').listAll();
    let urlPromises = result.items.map(imageRef => imageRef.getDownloadURL());
 
    return Promise.all(urlPromises);
    //console.log(urlPromises);

}

const loadImages = async () => {
    const urls = await fetchImages();
    setFiles(urls);
    console.log(urls[0]);
}
loadImages();
}, []);

返回(

      {urls.map((urls,i) => (
          <img src={urls} key={i}/>
      ))} 
     
  </div>

);

}

导出默认视图图像；

【问题讨论】：

标签： reactjs google-cloud-firestore

【解决方案1】：

问题是您在空字符串 ('') 上调用 map 方法，这是 urls 的初始值。改为将其设置为空数组。

const [urls, setFiles] = useState([])

【讨论】：