【发布时间】:2023-02-12 16:56:51
【问题描述】:
我基本上是在获取一堆用户数据并在页面加载时显示他们的用户名列表。我使用悬念的目的是在处理 userList 组件时显示“正在加载...”文本,但由于某种原因它不显示回退中提到的加载文本。我正在使用最新的 React 18 版本。
import React, { useState, useEffect, Suspense } from "react";
function UsersList() {
// Fetches and returns List of users
const [users, setUsers] = useState([]);
useEffect(() => {
try {
fetch("https://jsonplaceholder.typicode.com/users")
.then((response) => response.json())
.then((data) => setUsers(data));
} catch (error) {
// handle the error here
}
}, []);
return (
{users.map((user) => (
- {user.name}
))}
);
}
function App() {
return (
Users List
Loading...}>
Below are the user detailed fetched :
);
}
export default App;
我尝试使用节流来降低 chrome 开发工具上的网络速度,但仍然没有显示加载文本。