我基本上是获取一堆用户数据并在页面加载时显示他们的用户名列表。我使用suspension的目的是在处理userList组件时显示“Loading...”文本，但由于某种原因，它没有显示回退中提到的加载文本。我使用的是最新的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 (
    <div>
      <ul>
        {users.map((user) => (
          <li key={user.id}>{user.name}</li>
        ))}
      </ul>
    </div>
  );
}

function App() {
  return (
    <div className="App">
      <h2>Users List</h2>
      <Suspense fallback={<h1> Loading...</h1>}>
        <h4> Below are the user detailed fetched : </h4>
        <UsersList />
      </Suspense>
    </div>
  );
}

export default App;

我试过在chrome开发工具上使用节流来降低网络速度，但仍然不显示加载文本。