Question

这是代码片段：

  useEffect(() => {
    async function fetchData() {
      const url = 'https://api.randomuser.me';
      const response = await fetch(url);
      console.log('response: ', response);
    }
    fetchData();
  }, []);

如您所见，它是一个 useEffect 钩子，为某些数据调用公共 API，使用 async await 以等待响应。

但是记录的数据不包含它应该包含的内容。

这是在console.log中：

body: ReadableStream
bodyUsed: false
headers: Headers {}
ok: true
redirected: false
status: 200
statusText: ""
type: "cors"
url: "https://api.randomuser.me/"
__proto__: Response

怎么了？

Answer 1

您需要使用 response.json()

将响应解析为 JavaScript 对象


  useEffect(() => {
    async function fetchData() {
      const url = 'https://api.randomuser.me';
      const response = await fetch(url);
      const result = await response.json()
      console.log('result: ', result); // this the actual json response
    }
    fetchData();
  }, []);

异步 useEffect 不适用于获取数据

1 个答案: