项目开发难点-要求el-radio组件实现点击切换的时候，先弹出框判断是否符合条件，如果符合radio的值发生变化，不符合则不变。解决方法v-model的分解式 :value @Input-526互联

需求描述：页面radio点击的时候，先不改变radio的值，先弹出框进行判断是否符合一定的条件如果符合则发生变化，否则radio不发生变化,页面还显示原来的值。
问题难点：在vue项目中，使用
- ```
  <el-radio v-model="radio" label="1">备选项1</el-radio>
  <el-radio v-model="radio" label="2">备选项2</el-radio>
```
- 存在问题v-model并不能截取到点击后，变化前的操作，事实上是点击“备选项2”的时候，radio的值已经变成2了才能执行@change的事件，因为change事件就是值发生变化才会执行的事件。
- 假设我们element的el-radio中有before-change事件就好了，但是没有。
- 所以换种思路解决。想到v-model的分解式

v-model的分解式 :value @Input

将页面中的v-model改为最原始的写法

<template>
    <el-radio :value="radio" @input=InputHandle($event) label="1">备选项1</el-radio>
    <el-radio  :value="radio" @input=InputHandle($event) label="2">备选项2</el-radio>
</template>

<script>
  export default {
    data () {
      return {
        radio: '1'
      };
    }
    methods: {
      InputHandle(val) {
        this.$confirm(' 是否改变当前值?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
           this.radio = val
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          });          
        });
      }
    }
  }
</script>