我們如何根據條件禁用 antd 表的復選框？

Question

例如，有 n 條記錄我只想啟用選定的復選框重新挖掘所有記錄應自動禁用？ 請在下面檢查我的 getCheckboxProps() 函數檢查錯誤無法解決

沙盒鏈接

我想禁用所有未選中的復選框，這里我沒有任何復選框可以啟用長度，我們不應該跨越那個長度。在我的情況下，剩余_total 變量。任何人都可以在正確的方向上幫助我嗎？

Answer 1

然而，單向您提供的鏈接被打破，以禁用所有antd表行的復選框是返回{disabled: true}上getCheckboxProps在每個周期運行。 如果您有一個唯一的鍵或項目，您可以使用它來禁用特定行，如果滿足條件，只需返回{disabled: true} 。 以下是啟用前兩行復選框的示例：

const data = [
  {
    key: "1",
    name: "John Brown",
    age: 32,
    address: "New York No. 1 Lake Park"
  },
  {
    key: "2",
    name: "Jim Green",
    age: 42,
    address: "London No. 1 Lake Park"
  },
  {
    key: "3",
    name: "Joe Black",
    age: 32,
    address: "Sidney No. 1 Lake Park"
  },
  {
    key: "4",
    name: "Bon Jov",
    age: 99,
    address: "Sidney No. 1 Lake Park"
  },
  {
    key: "5",
    name: "User 5",
    age: 99,
    address: "Sidney No. 1 Lake Park"
  },
  {
    key: "6",
    name: "User 6",
    age: 99,
    address: "Sidney No. 1 Lake Park"
  }
];

const rowSelection = {
  getCheckboxProps: (record) => {
    const rowIndex = data.findIndex((item) => item.key === record.key);
    return {
      disabled: rowIndex > 1 //enable first 2 rows only
    };
  }
};

這是禁用前 4 行的示例：

const rowSelection = {
  getCheckboxProps: (record) => {
    const rowIndex = data.findIndex((item) => item.key === record.key);
    return {
      disabled: rowIndex < 4 //disable the first 4 rows only
    };
  }
};

這是一個工作示例：