### 使用 v-model 綁定了 selection 參數就會開啟多選列，選中數據會自動同步：
```
<template>
<ele-pro-table
:datasource="datasource"
:columns="columns"
v-model:selection="selection"
:row-selection="{ columnWidth: 48 }">
</ele-pro-table>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import type { User } from '@/api/system/user/model';
// 表格選中數據，需要默認選中給 selection 賦值即可
const selection = ref<User[]>([]);
/* 清空選擇 */
const clearSelection = () => {
selection.value = [];
};
</script>
```
### `row-selection`參數可不寫，里面的`selectedRowKeys`、`onChange`、`type`三個字段不需要寫，如果需要監聽選擇改變：
```
<template>
<!-- 把 v-model 拆開寫，或者簡單一點，用 watch 監聽 selection 也行 -->
<ele-pro-table
:selection="selection"
@update:selection="onSelectionChange">
</ele-pro-table>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import type { User } from '@/api/system/user/model';
const selection = ref<User[]>([]);
const onSelectionChange = (selection) => {
selection.value = selection;
};
</script>
```
### 開啟單選列與多選列類似，使用 v-model 綁定了`current`參數即可，也支持設置`row-selection`參數：
```
<template>
<ele-pro-table v-model:current="current" selection-type="radio"></ele-pro-table>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import type { User } from '@/api/system/user/model';
// 表格單選選中數據
const current = ref<User>();
/* 清空選擇 */
const clearSelection = () => {
current.value = undefined;
}
</script>
```
### 也可以同時綁定`current`和`selection`，并通過`selectionType`動態控制是單選列還是多選列：
```
<template>
<ele-pro-table
v-model:current="current"
v-model:selection="selection"
:selection-type="selectionType">
</ele-pro-table>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import type { User } from '@/api/system/user/model';
// 表格單選選中數據
const current = ref<User>();
// 表格多選選中數據
const selection = ref<User[]>([]);
//
const selectionType = ref('radio');
/* 動態改變為多選列 */
const changeSelectionType = () => {
selectionType.value = 'checkbox';
}
</script>
```
### 多選列實現禁用某些數據的復選框，通過`row-selection`實現：
```
<template>
<ele-pro-table v-model:selection="selection" :row-selection="rowSelection"></ele-pro-table>
</template>
<script lang="ts" setup>
import { ref, reactive } from 'vue';
import type { User } from '@/api/system/user/model';
const selection = ref<User[]>([]);
const rowSelection = reactive({
columnWidth: 48,
getCheckboxProps: (record) => {
return {
disabled: record.id < 3 // 這里是讓 id<3 的禁用，根據自己業務修改
};
}
});
</script>
```
