由现有的项目改向nuxt3,逻辑遵从现在项目,通过接口返回的字段进行前端状态码404
1. 在根目录下新建一个error.vue文件,并在文件中写上你需要的404页面样式
我这里是做测试,就简单的写一些
<template>
<div>
<h1>这里是错误404页面</h1>
</div>
</template>
2. 在需要写逻辑的页面开始写逻辑
我这里项目的逻辑是通过接口返回的code字段规定的参数来判断
<script setup lang="ts">
import { defineComponent,reactive, ref, toRefs } from 'vue';
const route = useRoute()
const {data,error} = await useAsyncData('users', () =>
$fetch(`http://xxx.com/api/tag/detail?id=${route.params.id}&article_num=3`)
)
if(data.value.code !== 0){
throw createError ({ statusCode: 404, })
}else{
console.log('将会正确执行数据逻辑')
}
</script>