先说需求，需求是：在点击el-radio之后需要先做一个二次确认，用户确认修改之后再修改绑定值，否则保持原来的值不变
使用v-model绑定值，change事件会直接改变绑定值，获取到的是改变之后的值，无法获取改变之前的值：
<el-radio-group v-model="radio1" @change="handleChange">
<el-radio label="1">备选项1</el-radio>
<el-radio label="2">备选项2</el-radio>
</el-radio-group>
handleChange(val) {
console.log('val', val)
},
解决方法：把vmodel分解成:input和@input的写法
<el-radio-group :value="radio2" @input="handleInput">
<el-radio label="1">备选项1</el-radio>
<el-radio label="2">备选项2</el-radio>
</el-radio-group>
handleInput(val) {
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.radio2 = val
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
这样会在用户选择改变之后，才去改变绑定值，用户选择取消的话不会改变绑定值，完美实现需求
二次确认
