antd 表格树如何展开_ant-design-pro protable 树形表格默认展开
Protable 是在antd 的 table 上進行了一層封裝,antd -table中有的屬性它都支持. 當表格數(shù)據(jù)中有children字段,table會默認生成樹形可展開表格,有時候需要一開始就默認展開,文檔有一個屬性defaultExpandAllRows默認展開所有行,但是設置這個之后并沒有生效,原因是這個屬性只在初始的時候加載一次,一般數(shù)據(jù)是從后臺請求的,當時數(shù)據(jù)還沒回來,數(shù)據(jù)回來時這個屬性已經(jīng)不會再次更新了.
如果是使用antd 的table,可以在表格元素加一個判斷,數(shù)據(jù)存在在渲染
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} /> : '暫無數(shù)據(jù)'}
>)
}
exportdefault Tree
但是在Protable中這個方法并不適用,使用expandable的另一個屬性defaultExpandedRowKeys可以達到這個效果,只是要多處理一次數(shù)據(jù)
const Tree: React.FC =
總結(jié)
以上是生活随笔為你收集整理的antd 表格树如何展开_ant-design-pro protable 树形表格默认展开的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 微信联系人可以隐藏吗(微信公众平台)
- 下一篇: tensorflow量化感知训练_ten