(三)React+.Net+Typescript全栈(动态Router/Redux/RTK Query获取后端数据)
文章目录
- 项目地址
- 一、Router
-
- 1.1 创建Router
-
- 1. 页面
- 2. 创建路由
- 3. Outlet子路由使用
-
- 1. 基本使用
- 2. 嵌套使用
- 4. 导航栏里使用路由
- 1.2 动态路由传参
-
- 1. 商品列表页传参
- 2. 商品详情页
- 二、Redux
-
- 2.1 使用Toolkit
-
- 1. 定义Reducer
- 2.2 配置Store
- 2.3 使用
- 三、RTK Query
-
- 3.1 请求后端数据
-
- 1. 创建base请求
- 2. 请求商品列表和商品详情
- 3. 在store里注册
- 4. 请求商品列表
- 5. 请求商品详情
- 3.2 添加Loading 动画
-
- 1. 创建加载的reducer
- 2. 在store里注册
- 3. 添加Loading组件在页面里
项目地址
- 教程作者:
- 教程地址:
- 代码仓库地址:
- 所用到的框架和插件:
dbt
airflow
一、Router
1.1 创建Router
1. 页面
- 伪页面
2. 创建路由
Router.txs
里创建路由规则
3. Outlet子路由使用
1. 基本使用
- 在App.txs里直接使用
2. 嵌套使用
- 如果在子路由里还有其他的子路由
- 例如
{path: "/dashboard",element: <DashboardLayout />,children: [{ path: "profile", element: <ProfilePage /> },{ path: "settings", element:</