首页 > 解决方案 > 在跳过数组中的第一个对象时从 API 获取数据

问题描述

使用 react.js,我正在尝试使用以下代码从 API 获取数据:

import React,{useState,useEffect} from 'react';

function App() {
  const [data,setData]=useState([]);
  const getData=()=>{
    fetch('src/data.json')
      .then(function(response){
        return response.json();
      })
      .then(function(myJson) {
        setData(myJson)
      });
  }
  
  useEffect(()=>{
    getData()
  },[])

  return (
    <ul>
      {data.map((item) =>
        <li key={item.id}>{item.name}</li>
      )}
    </ul>
  );
}

export default App;

和 api json 响应是(来自 data.json 的示例):

{"users":
  [{"id":1,"name":"John"},{"id":2,"name":"Samantha"}]
}

如果我删除该对象{"users": },则代码可以工作,但 API 会将此对象添加到所有端点。

有没有办法忽略第一个对象,或者解构它,以便我得到以下输出:

标签: javascriptarraysreactjs

解决方案


如果您的 Javascript 解释器是最新的,您可以尝试使用扩展运算符。

object = {"users":
  [{"id":1,"name":"John"},{"id":2,"name":"Samantha"}]
};
object = {...object.users};

结果:

{ 
  0: {id: 1, name: 'John'},
  1: {id: 2, name: 'Samantha'}
}

更多信息: https ://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax


推荐阅读