Umi 组件中同步调用 Request: async/await 和 Promise 示例

在组件内部同步调用 request，可以使用async/await 或者 Promise 来实现。以下是使用async/await 的示例代码：

import { request } from 'umi';

export default function MyComponent() {
  // 在组件内定义一个异步函数，用来发送请求
  const fetchData = async () => {
    try {
      const response = await request('/api/your-api-endpoint');
      // 处理请求返回的数据
      console.log(response);
    } catch (error) {
      // 处理请求错误
      console.error(error);
    }
  };

  // 在组件挂载时调用 fetchData 函数
  useEffect(() => {
    fetchData();
  }, []);

  return (
    <div>
      {/* 组件的内容 */}
    </div>
  );
}

在上面的示例中，我们在组件内部定义了一个异步函数 fetchData，使用 await 关键字来等待 request 函数的返回结果。然后在组件挂载时调用 fetchData 函数来发送请求。

如果你不想使用 async/await，你也可以使用 Promise 来实现：

import { request } from 'umi';

export default function MyComponent() {
  // 在组件内定义一个函数，用来发送请求
  const fetchData = () => {
    request('/api/your-api-endpoint')
      .then(response => {
        // 处理请求返回的数据
        console.log(response);
      })
      .catch(error => {
        // 处理请求错误
        console.error(error);
      });
  };

  // 在组件挂载时调用 fetchData 函数
  useEffect(() => {
    fetchData();
  }, []);

  return (
    <div>
      {/* 组件的内容 */}
    </div>
  );
}

这里我们使用 then 和 catch 来处理 request 函数返回的 Promise 对象。