antd 2.0 的版本table的前面复选框 disabled不生效？ table的点击行与点击复选框：2中操作选择row，导致的selectrowkey不一样？

Yetian_2000

于 2021-05-14 15:35:42 发布

阅读量1.3k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： vue ant Design

本文链接：https://blog.youkuaiyun.com/Yetian_2000/article/details/116793289

vue 同时被 2 个专栏收录

50 篇文章

订阅专栏

ant Design

6 篇文章

订阅专栏

本文记录了在使用Ant Design (Antd) 时遇到的两个问题：1. 在Antd2.0版本中，table的复选框disabled属性不生效，原因是版本差异，解决方案是调整配置方式；2. 表格行点击与复选框选择导致的行选择key不一致，问题源于row-selection属性的onChange方法中this指向不正确。通过分析和调试，找到了正确的解决办法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天开发遇到2个坑：
1.antd 2.0 的版本table的前面复选框 disabled不生效？
踩坑原因：选用的antd版本不对，antd 2.0版本不需要props

getCheckboxProps: (record: any) => ({
   disabled: record.name === 'Disabled User', // Column configuration not to be checked
   name: record.name,
 }),

而antd 1.7 是这样的：

getCheckboxProps: (record: any) => ({
   props：{
  		 disabled: record.name === 'Disabled User', // Column configuration not to be checked
   		 name: record.name,
   }
 }),

2.table的点击行与点击复选框：2中操作选择row，导致的selectrowkey不一样？
bug原因分析：在antd table组件中，我写table属性 row-selection = rowSelection 这个对象里面。
这导致在执行changeRow时，this指向vue实例和我点击行拿到的this：vue实例不同。

const rowSelection = {
      onChange: changeRow
      getCheckboxProps: (record: DataType) => ({
        disabled: record.name === 'Disabled User', 
      }),
    };