How the iview,table component sets the currently selected line in code

how does the iview,table component set the currently selected line in code

Apr.03,2021

/ / this is the selected row set manually. This.$refs.mytable refers to ivew's table form
this.$refs.mytable.$refs.tbody.clickCurrentRow (0)


1. Click to select whether
Table props:
highlight-row supports highlighting selected rows, that is, select Boolean false;

<Table highlight-row :columns="columns" :data="data1"></Table>

2. Specifies the callback method for a row or multiple rows to display the className of the
Table props:
row-class-name row, passing in the parameter: row: current row data index: current row index Function-

<Table :row-class-name="rowClassName" :columns="columns" :data="data"></Table>
methods: {
    rowClassName (row, index) {
        if (index === 1) {
            return 'demo-table-info-row'; // 
        } else if (index === 3) {
            return 'demo-table-error-row'; // 
        }
        return '';
    }
}

do not use his default selection, to generate the check box of table, but select it yourself. Iview's own multi-selection is a bit creepy


if it is multiple selection, you can use the toggleSelect method in the table component

this.$refs.mytable.$refs.table && this.$refs.mytable.$refs.table.toggleSelect(index)
.
Menu