时间戳

首页 > 解决方案 > React Rest API 问题

javascript - React Rest API 问题

问题描述

我是 REST API 的新手，在当前项目中，我可以在画廊内创建画廊类别和图像，但遇到了问题。我在父数组中有多个对象，如下所示。其中一些包含图像。

[]
  0:
    0: {path: "test", name: "test"}
    1: {path: "puli", image: {…}, name: "puli"}
    2: {path: "animalsg", name: "animalsg"}
    3: {path: "animals", image: {…}, name: "animals"}
    4: {path: "Animals", image: {…}, name: "Animals"}
    5: {path: "sdfsf", name: "sdfsf"}
    6: {path: "viki", name: "viki"}
    7: {path: "pul", image: {…}, name: "pul"}
    8: {path: "testik", name: "testik"}
    __proto__: Object
    length: 1
__proto__: Array(0)

有没有办法从每个对象中获取所有名称值并为其分配一个 ID？你能帮我为此修改这个 useEffect 吗？

useEffect(() => {
      const tempAlbum = [];
      fetch('http://someapi.xy/gallery')
        .then(response => response.json())
        .then(data => tempAlbum.push('???'));
    }, [])

标签： javascriptreactjsapirestfetch

解决方案

如果我理解正确，你会想做这样的事情

useEffect(() => {
      const tempAlbum = [];
      fetch('http://someapi.xy/gallery')
        .then(response => response.json())
        .then(data => { data[0].forEach(
                           (item,i) => {
                                tempAlbum.push({name: item.name, id: i})
                            })
                       });
         }, [])

关于 id，这种方法使用与 id 相同的数组索引，除非您需要此 id 在 React 应用程序上呈现此数组，否则不建议使用索引，因此您可以使用库就像uuid即时生成 id 一样，使用起来非常简单，不需要配置。

推荐阅读