记录调试增加el-radio的取消功能
1.为单选加click事件
2.在方法中进行判断,同时进行逻辑处理
3. 方法很简单,注意思考
1)单选控件首先记录一个下标
2)点击一条记录时,先获取下标,然后与先前记录的下标比较。
如果值相等,则表示是第二次点击该记录,需将下标重置为初始值(代码设置初始值100,是因为每页最多10条记录);
如果值不相等,则表示第一次点击该记录,需将获取的下标赋值给定义的变量
3)其实就是个三目运算,但是没成功,所以写成了if-else
第一步:
<el-table
border
v-loading="loading"
:element-loading-text="loadingText"
:data="tableData"
tooltip-effect="dark"
stripe
size="small"
>
<el-table-column width="30">
<template slot-scope="scope">
<el-radio :label="scope.$index" v-model="radio" @click.native.stop.prevent="selectRadio(scope.$index, $event)"></el-radio>
</template>
</el-table-column>
<el-table-column type="index" label="序号" width="60px" align="center" show-overflow-tooltip></el-table-column>
</el-table>
第二步:
selectRadio (index, e) {
console.log('1this.radio;;;;', this.radio)
console.log('1index;;;;', index)
if (index === this.radio) {
this.radio = 100
} else {
this.radio = index
}
console.log('2this.radio;;;;', this.radio)
console.log('2index;;;;', index)
},
data中添加属性
data () {
return {
radio: 0
}
}