NuxtJs - 如何检查 useFetch 响应代码？

Question

使用 NuxtJs 时如何检查响应状态代码useFetch？

目前我正在按如下方式处理响应，但我无法在任何地方找到如何获取确切的响应状态代码，只有错误消息，例如FetchError: 403 Forbidden。

useFetch(url, options).then(
    (res) => {
        const data = res.data.value;
        const error = res.error.value;

        if (error) {
            console.error(error);
            // handle error
        } else {
            console.log(data);
            // handle success
        }
    },
    (error) => {
        console.error(error);
    }
);

Answer 1

在您的模板中，您可以使用error.statusCode

但在你的脚本中，你可以使用error.value.statusCode

检查这个：

<template>
  <div>
    error : {{ error.statusCode }}
  </div>
</template>

<script setup>
const { data, pending, error, refresh } = await useFetch("https://api.nuxtjs.dev/mountais",
  { pick: ["title"] }
);
console.log(error.value.statusCode);
</script>

如果您成功收到请求，该error对象将为空