点击行时默认设置单选或多选状态

场景描述

表格组件的设置了单选或多选后,默认是点击单选或者多选框才可以是选中状态,点击行的时候不会设置单选或多选状态,需要在点击行的也设置单选或多选状态

实现思路

在表格组件的行点击事件中代码控制

具体实现

1.单选的控制

    onTable0RowClick = ({event,record,index}) => {
       var mainData = this.comp("mainData"); //获取表格组件绑定的数据集
       var selectData = this.comp("selectData");//获取表格组件选中数据集设置的数据集
       var idColumn = selectData.getIdColumn();//获取选中数据集的idColumn
       var rowId = record[idColumn];//从record参数中获取idColumn列的值
       selectData.clear();//清除选中数据集的数据
       mainData.copyRows(rowId,"selectData");//把表格组件绑定的数据集中当前点击行的数据复制到选中数据集上,即设置为选中状态
    }

2.多选的控制

    onTable0RowClick = ({event,record,index}) => {
        var mainData = this.comp("mainData");//获取表格组件绑定的数据集
        var selectData = this.comp("selectData");//获取表格组件选中数据集设置的数据集
        var selectedRowKeys = selectData.getIDs();//获取当前选中的数据
        var idColumn = selectData.getIdColumn();//获取选中数据集的idColumn
        var rowId = record[idColumn];//从record参数中获取idColumn列的值
        if(selectedRowKeys.indexOf(rowId) > -1){//判断当前点击的行是否是选中状态,选中状态取消选中,未选中设置为选中
             selectData.removeData(rowId);//取消选中
        }
       else
           mainData.copyRows(rowId,"selectData");//设置为选中
    }

results matching ""

    No results matching ""

    results matching ""

      No results matching ""