React.js show 如何使用 fetch 方法显示所有数据

Question

我是编程初学者。现在我正在尝试使用获取数据方法在显示器中显示所有数据。但是无法显示这个。

import { useEffect, useState } from "react";

const useProducts = () => {
    const [items, setItems] = useState([]);
    useEffect(() => {
        fetch("https://damp-island-69804.herokuapp.com/inventory")
            .then(res => res.json)
            .then(data => setItems(data))
    }, [])
    return [items, setItems];
}
export default useProducts;

这段代码有什么问题？请帮助。

Answer 1

请注意您的代码中的 res => res.json 应该是 res.json()，因为它是一个函数，而不是属性。

Answer 2

参考这个例子：https://www.freecodecamp.org/news/fetch-data-react/

使用 resp.json() 而不是 resp.json
检查 resp.ok 如果没有抛出异常。然后在另一个状态变量中设置异常消息。
如果使用加载程序，则使用 setter 相应地显示和隐藏。
相应地添加 try 和 catch 并在 finally 块中进行清理。

React.js show 如何使用 fetch 方法显示所有数据

How show display all data using fetch method in React.js

javascript

fetch