React学习（六）

目录：

1.react-进阶-antd-入门

2.react-进阶-antd-表格

3.react-进阶-antd-分页

1.react-进阶-antd-入门

在入口文件中已经引入了样式css，直接继续在这个里面添加就行

按钮组件

对话框组件：

浏览器默认对话框

默认使用的英文的确认取消，我们想改成中文的，我们可以修改最外层的组件index.tsx中加入一个标签：

2.react-进阶-antd-表格

标题：

可以给标题加一个类型声明，这样写代码时可以有更好的提示功能

提供数据：

数据来自服务器，我们来声明一个状态变量：

添加dataIndex属性，显示数据：

现在报错缺一个唯一标识

加一个属性：

接口调用的时候如果有延迟，我们可以加一个加载标签

true的话会一直加载：需要设置成动态的

3.react-进阶-antd-分页

需要给分页属性给一些相关信息，第几页、每页几条数据等这些会发生变化，页面也要跟着渲染，所以一把这些信息用状态管理起来

这里点击第二页是不生效的：添加一个onchange事件

此时分页是客户端的分页，是吧数据全查询出来再客户端进行的分页，这个适应数据量少的分页，我们要实现服务器端的分页，需要后端进行分页查询特定分页数据

前端定义一个返回的新类型

此时点击第二页是无效的，因为useEffect只会加载一次，不会再发送请求了，需要用第三种用法，根据依赖项改变时请求多次

添加改变每页显示条数

每页大小默认每页从10条开始，我们定以的每页5条，初始页面显示，当切换记录数后，只会显示这四个，每页5条就没有了

我们可以自定义显示