vue3+elementplus el-table表格实现单选

<el-table :data="pageData.tableData" highlight-current-row border style="width: 100%" @row-click="handleClickRow">
    <el-table-column align="center" min-width="55" label="Select">
        <template #default="scope">
            <el-radio class="radio" v-model="pageData.redioSelectValue" :label="scope.row.id"></el-radio>
        </template>
    </el-table-column>
    <el-table-column type="radio" prop="date" label="Match Name" width="180"> </el-table-column>
    <el-table-column prop="date" label="Match Name" width="180"> </el-table-column>
    <el-table-column prop="name" label="Klarf Example" width="180"> </el-table-column>
    <el-table-column prop="address" label="RegExp"> </el-table-column>
    <el-table-column :resizable="false" prop="waferCount" label="Wafer Count" min-width="75" show-overflow-tooltip />
   
</el-table>

const pageData = ref({
    tableData: [
        { id: 1, data: 555, address: 8888 },
        { id: 2, data: 555, address: 8888 },
        { id: 3, data: 555, address: 8888 }
    ],
    searchValue: '',
    redioSelectValue: ''
})

const handleClickRow = (row) => {
    pageData.value.redioSelectValue = row.id
}