(三).Net, NextJS(NextJs初始化/图片闪烁/定义types/分页/过滤/)
文章目录
- 项目地址
- 一、NextJs
-
- 1.1 项目初始化
-
- 1. 创建next项目
- 2. 创建一个导航栏
- 3. 创建拍卖Card组件
-
- 单个卡片效果
- 倒计时
- 解决闪屏问题
- 创建types
- 4. 分页处理
-
- 分页组件
- 添加分页组件在List组件中
- 发送分页请求fetch
- 5. 添加Filter功能
-
- 可选每页的展示数量
- Filter组件进行过滤
- 6. 使用zustand状态管理
项目地址
- 教程作者:
- 教程地址:
- 代码仓库地址:
- 所用到的框架和插件:
dbt
airflow
一、NextJs
1.1 项目初始化
1. 创建next项目
2. 创建一个导航栏
3. 创建拍卖Card组件
- 单个Card的组成:
- Props父类传来的单个Auction数据
- 图片组件,用于控制图片的大小和加载效果
- 倒计时组件,用于显示拍卖剩余倒计时
- 卡片信息的文字