antDesignVue表格符合条件的复选框禁选

order_goods_id是选择框选择以后，后端需要的数据

     <s-table
      ref="table"
      :data="loadData"
      :pageSize="10"
      :columns="columns"
      :loading="isLoading"
      :rowSelection="rowSelection"
      :rowKey="
        (record, index) => {
          return record.order_goods_id
        }
      "
    >

rowKey的值务必要保持唯一性，这样才不会影响其他的复选框,不能用index

  computed: {
    rowSelection() {
      const _this = this
      const { selectedRowKeys } = this
      return {
        selectedRowKeys,
        onChange: this.onSelectChange,
        onSelection: this.onSelection,
        // antDesignVue表格符合条件的复选框禁选
        getCheckboxProps: (record) => ({
          //record为选中的表格行
          props: {
            disabled: record.check_status == 1,
          },
        }),
      }
    },
    hasSelected() {
      return this.selectedRowKeys.length > 0
    },
  },
methods:{
    onSelectChange(selectedRowKeys, selectedRows){
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
    },
}

使用getCheckboxProps可实现让符合条件的复选框禁选

实现效果：没有联系电话的复选框不可选

其他有联系电话的复选框并不会受到影响，还是可选的

原文地址