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 树形表格默认展开的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。