Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
400 views
in Technique[技术] by (71.8m points)

Ant design table如何默认全选?

使用table实现了一个购物车,想实现默认全选功能,使用getCheckProps函数后功能实现了,但是不能取消选择,
代码如下

const rowSelection = {
  onSelect: (record, selected, selectedRows) => {
    console.log(selected, selectedRows)
    addCheked(selectedRows)
  },
  onSelectAll: (selected, selectedRows, changeRows) => {
    console.log(selected, selectedRows)
    addCheked(selectedRows)
  },
  getCheckboxProps: record => ({
    defaultChecked:record.key === 2
  })
}
 <Table 
  className="products-table" 
  rowSelection={rowSelection} 
  columns={columns} 
  dataSource={products}  
  pagination={false}
  footer={()=>{
    if(products.length>0){
      return <CartFooter removeAll={removeAll} numAndPrice={numAndPrice} />
    }
  }}>
</Table>

图片描述


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

个人感觉你的全选是有问题的,我在摸索的时候 如果是多选 如下设置就已经全选
getCheckboxProps:record=>({

defaultChecked:record.key

})
至于你说的不能取消的原因 个人判断是因为key的值的问题 是不是全是为2?
如果你已经解决 求教。(个人愚见)


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...