ant design 表格columns配置解析

react項(xiàng)目中引入ant design的組件,配置項(xiàng)內(nèi)容很多,功能也非常強(qiáng)大。


前三個(gè)基本項(xiàng)不做過(guò)多的說(shuō)明,title表示列頭顯示文字,dataIndex列數(shù)據(jù)在數(shù)據(jù)項(xiàng)中對(duì)應(yīng)的 key,key是你數(shù)據(jù)中相對(duì)應(yīng)傳入的屬性。


render函數(shù)返回三個(gè)值(text, record, index),text表示本項(xiàng)內(nèi)容對(duì)應(yīng)的value,record的值是一個(gè)object,里面存放了這一行數(shù)據(jù)的內(nèi)容,index表示當(dāng)行索引。箭頭后面的內(nèi)容trans(text) 表示真正要在table表格顯示的數(shù)據(jù),相當(dāng)于一個(gè)過(guò)濾器,可以把后臺(tái)數(shù)據(jù)拿到的值直接在此處轉(zhuǎn)換。

width用來(lái)規(guī)定列寬,沒(méi)有規(guī)定則自行根據(jù)內(nèi)容顯示列寬。官方文檔有說(shuō)明fixed: 'right',固定在列表右側(cè),但是當(dāng)列不夠多的時(shí)候,會(huì)顯示兩個(gè)一樣的列。fixed:true的效果同fixed: 'left'。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀(guān)點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容