这是一个 API 会在一段时间后发生变化答案

【问题标题】：here is an API that changes after some time I want previous data to be stored in an array and latest data too I dont how to figure this out?这是一个 API 会在一段时间后发生变化
【发布时间】：2022-02-13 19:14:57
【问题描述】：

我希望data state 是一个数组，当 API 中的数据发生变化时，它会将数据相加这样它就可以存储以前的数据以及新数据，以便我可以映射它们并显示它们

App.js

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

const App = () => {
  const [data, setData] = useState([]);
  const [entireData, setEntireDate] = useState([]);
  

  let arr = [];
  const fetchAPI = async () => {
    const API = await fetch("https://randomuser.me/api");
    const json = await API.json();
    let results = json.results;
    setData(results);
  };

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

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

  return (
    <>
      <div className="container">
        <p>
          {data.map((val, idx, arr) => {
            return val.login.username;
          })}
        </p>
        <img
          src={data.map((val, idx, arr) => {
            return val.picture.large;
          })}
          alt="getPicFromJson"
        />
      </div>
    </>
  );
};

export default App;

index.js

import { StrictMode } from "react";
import ReactDOM from "react-dom";

import App from "./App";

const rootElement = document.getElementById("root");
ReactDOM.render(
  <StrictMode>
    <App />
  </StrictMode>,
  rootElement
);

【问题讨论】：

标签： javascript html css reactjs

【解决方案1】：

也许可以试试这样的

  const fetchAPI = async () => {
    const API = await fetch("https://randomuser.me/api");
    const json = await API.json();
    let results = json.results;
    // here you get the old data and pushing the results into Data
    Data.push(results)
    // and setData to Data that has (Data + results)
    setData(Data);
  };

如果您想在刷新浏览器后获取数据，您可能需要将Data 存储在本地存储中并从中获取初始数据

【讨论】：