Reactjs 中的 setState 不是函数

Question

我是新手，我正在尝试使用fetch 和setState 访问一个状态变量的 API，但它会抛出错误

Unhandled Rejection (TypeError): Object(...) is not a function

Here is the code -> CodeSandboxLink

import React from "react";
import { useState, useEffect, setState } from "react";
import "./styles.css";

export default function App() {
  const [person, setPerson] = useState([]);
  fetch("https://jsonplaceholder.typicode.com/users")
    .then((response) => {
      return response.json();
    })
    .then((data) => {
      setState(data);
    });
  console.log("dasdasd", person);
  return <div className="App">{JSON.stringify(person)}</div>;
}

请提出我做错的地方。

Answer 1

import React from "react";
import { useState, useEffect } from "react";
import "./styles.css";

export default function App() {
  const [person, setPerson] = useState([]);
  useEffect(() => {
    fetch("https://jsonplaceholder.typicode.com/users")
      .then((response) => {
        return response.json();
      })
      .then((data) => {
        setPerson(data); // You Need this For set Person to `state person`
      });
  }, []);
  console.log("dasdasd", person);
  return <div className="App">{JSON.stringify(person)}</div>;
}

API 使用状态： https://reactjs.org/docs/hooks-state.html

API 使用效果： https://reactjs.org/docs/hooks-effect.html