（四）React+.Net+Typescript全栈（错误处理） - 指南

---

文章目录

• 项目地址
• 一、错误处理
• • 1.1 普通弹窗处理
  • • 1. baseapi
    • 2. 普通错误处理
  • 1.2 Validation Error
  • 1.3 Not Found Page
  • • 1. 创建not found页面
    • 2. 在baseApi里处理
• 二、购物车
• • 2.1 购物车api
  • • 1. Query创建
    • • RTK Query
      • mutataion
    • 2. store里更新api
    • 3. 购物车页面
    • • 创建页面
      • 添加basket页面的路由
      • 商品列表页直接添加
    • 4. 解决缓存问题

---

项目地址

• 教程作者：
• 教程地址：

• 代码仓库地址：

• 所用到的框架和插件：

dbt
airflow

一、错误处理

1.1 普通弹窗处理

1. baseapi

• baseApi.ts里通过对response的判断，来决定是否
• 通过switch判断，普通错误使用toast组件，显示在页面的右下角

const customBaseQuery = fetchBaseQuery({

baseUrl: 'https://localhost:5001/api'
});
type ErrorResponse = | string | {
title: string
} | {
errors: string[]
};
const sleep = () =>
new Promise(resolve =>
setTimeout(resolve, 1000));
export const baseQueryWithErrorHandling = async (args: string | FetchArgs, api: BaseQueryApi,
extraOptions: object) =>
{

api.dispatch(startLoading());
await sleep();
const result = await customBaseQuery(args, api, extraOptions);
api.dispatch(stopLoading());
if (result.error) {

console