antd 表格树如何展开_ant-design-pro protable 树形表格默认展开
Protable 是在antd 的 table 上进行了一层封装,antd -table中有的属性它都支持. 当表格数据中有children字段,table会默认生成树形可展开表格,有时候需要一开始就默认展开,文档有一个属性defaultExpandAllRows默认展开所有行,但是设置这个之后并没有生效,原因是这个属性只在初始的时候加载一次,一般数据是从后台请求的,当时数据还没回来,数据回来时这个属性已经不会再次更新了.
如果是使用antd 的table,可以在表格元素加一个判断,数据存在在渲染
const Tree: React.FC = () =>{
const [treeData, setTreeData]=useState([])
const getData= () =>{
setTimeout(()=>{
setTreeData(data)
},2000);
}
useEffect(()=>{
getData()
}, [])return (<>{(treeData&& treeData.length) ?
columns={columns}
expandable={{defaultExpandAllRows: true}}
dataSource={treeData} /> : '暂无数据'}
>)
}
exportdefault Tree
但是在Protable中这个方法并不适用,使用expandable的另一个属性defaultExpandedRowKeys可以达到这个效果,只是要多处理一次数据
const Tree: React.FC =
antd 表格树如何展开_ant-design-pro protable 树形表格默认展开相关推荐
- ant design pro模板_Ant Design Pro入门教程,安装,运行(V5 Typescript版)
[前言] 找了很多Admin模板,最后还是看中了AntDesignPro这个阿里巴巴开源的Admin框架,长这样(还行吧,目前挺主流的): 该套模板是使用了React开发框架作为基础,AntDesig ...
- ant design pro模板_Ant Design Pro 学习笔记
学习笔记 摘要介绍 Ant Design Pro 是一个基于Ant Design搭建起来的模板项目.它提供了两个主要布局:BasicLayout.UserLayout,在布局基础上制作了20多个基础页 ...
- 23 版本以上的v4包_Ant Design Pro V2升级到V4 小结
前言 前不久接手过一个历史悠久的项(shi)目(shan),技术栈之复杂(混乱)令我潸然泪下:你甚至可以在一个项目里使用前端三大框架(Angular1, Vue, React). 三份的代码,本应该给 ...
- ps2020的antlib文件在哪_ant design pro 新增页面
ant design pro 新增页面 2.由于pro版本升级到2.0,所以重新做了一个分享,下面是目录地址 1.在 src/routes/ 下面的任意一个文件夹下面创建一个页面 // 填写如下内容 ...
- ant design pro 加载慢_ant design pro项目打包后页面加载缓慢
用ant design pro框架做的项目,打包之后每一个页面加载的速度都特别慢,在.webpackrc里面配置了ignoreMomentLocale: true, disableDynamicImp ...
- 7nfs客户端没权限_Ant design pro v4-服务器菜单和路由权限控制
要解决的问题:ant design pro默认情况下,菜单和路由都用配置的方式,在前端的config/config.ts中配置.但是大多数后台系统都需要由后端服务器控制权限. 类似的需求一般包括两点: ...
- antdesign 柱状图_ant design pro (十)advanced 图表
一.概述 Ant Design Pro 提供了由设计师精心设计抽象的图表类型,是在 BizCharts 图表库基础上的二次封装,同时提供了业务中常用的图表套件,可以单独使用,也可以组合起来实现复杂的展 ...
- ant design 预览图片_Ant Design Pro上传图片
Ant Design Pro上传图片 今天看了下Ant Design Pro上传图片的插件,感觉挺简单,也没有遇到太多问题,分享个大家!顺便记录下. 这里有个坑,主要文件命名的时候不要和保留关键词同名 ...
- ant design pro模板_ant design pro 当中改变ant design 组件的样式和 数据管理
ant design pro 简介 官网简介 Ant Design Pro 是一个企业级中后台前端/设计解决方案,我们秉承 Ant Design 的设计价值观,致力于在设计规范和基础组件的基础上,继续 ...
最新文章
- Java项目:校园人力人事资源管理系统(java+Springboot+ssm+mysql+jsp+maven)
- 小白也能看懂:一文学会入门推荐算法库 surprise
- python整数分节输出_pyfactor
- python pip download_Python Pip 参考手册 - pip download 命令
- EmWin 接触---基础函数
- mysql索引下推原理_mysql的索引下推理解和实践
- Python使用装饰器捕获异常
- 算法笔记:二叉树的序列化和反序列化(剑指 Offer 37)
- Highcharts数据可视化工具功能效果图详解
- 计算机 科研进度安排,研究计划进度安排及预期目标-浙江大学现代教务管理系统.doc...
- 北斗与GPS有哪些区别?
- “神一般存在”的印度理工学院到底有多牛?
- 红豆熟了之后会生出什么呢?
- 十六进制 转 八进制
- (四)改掉这些坏习惯,还怕写不出健壮的代码?
- linux禁用用户账号,linux 如何禁用账号和解除禁用账号
- 【券后价9.90元】【包邮】荷叶茶冬瓜荷叶茶叶纯干玫瑰花茶袋泡花草茶包组合天然决明正品子...
- 图或网络中的中心性:点度中心性、中介中心性、接近中心性、特征向量中心性、PageRank
- DNSPod十问深创投刘辉:产业互联网是烧钱做慈善吗?
- linux swi 内核sp,应用调试(四)系统调用SWI
热门文章
- 微型CRM SaaS应用HubSpot的一些使用截图
- OPA 18 - iTeardownMyAppFrame
- sap.ca.scfld.md.controller.BaseMasterController - how is extend method implemented
- 分析IBASE save 白屏问题
- 使用ABAP代码获得tcode RZ11里的参数值
- 使用ST03N查看指定user的transaction 性能数据
- SAP UI5 WebIDE里使用Mock数据的工作原理介绍
- SAP应用搜索分页的实现原理
- 使用命令行结合jq提取出Kubernetes配置文件里的secret信息
- 边缘计算框架_【北大成果】一种集成多组网协议多边缘计算框架的边缘计算处理平台...