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

Posted

技术标签:

【中文标题】TypeError: urls.map 不是 React 中的函数【英文标题】:TypeError: urls.map is not a function in 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>

);

导出默认视图图像;

【问题讨论】:

【参考方案1】:

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

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

【讨论】:

以上是关于TypeError: urls.map 不是 React 中的函数的主要内容,如果未能解决你的问题,请参考以下文章

添加reactstrap工具提示会导致TypeError:target.removeEventListener不是函数

TypeError:不能在 re.findall() 中的类似字节的对象上使用字符串模式

运行rails应用程序时出现webpacker错误。 'TypeError:environment.plugins.set不是函数'

IOS release build crash: TypeError: n.render is not a function。 (在 'n.render()' 中,'n.render' 未定义) Re

TypeError: not all arguments converted during string formatting

× TypeError: Cannot read properties of undefined (reading 'getState')