nuxt-starter/app/pages/index/index.vue

<!--
 * @Author: LiZhiWei
 * @Date: 2026-01-09 15:47:55
 * @LastEditors: LiZhiWei
 * @LastEditTime: 2026-01-09 15:48:02
 * @Description: 
-->
<template>
  <div class="p-10 flex flex-col items-center gap-4">
    <h1 class="text-2xl font-bold">Nuxt 4 Template Test</h1>

    <div class="flex gap-4">
      <el-button type="primary" @click="showSuccessMessage">测试成功提示</el-button>
      <el-button type="danger" @click="triggerHttpError">测试 HTTP 错误 (401)</el-button>
      <el-button type="warning" @click="triggerServerError">测试服务器错误 (500)</el-button>
    </div>
  </div>
</template>

<script setup lang="ts">
  import { checkStatus } from '~/utils/fetch/checkStatus'

  const showSuccessMessage = () => {
    ElMessage.success('这是一条 Element Plus 的成功提示')
  }

  const triggerHttpError = () => {
    // 模拟 HTTP 401 错误
    checkStatus(401, '登录已过期，请重新登录')
  }

  const triggerServerError = () => {
    // 模拟 HTTP 500 错误
    checkStatus(500, '内部服务器错误')
  }
</script>
<style scoped lang="scss"></style>