取消radio的选中状态

radio一旦选中一般是取消不了选中状态的，但是可以通过js操作数据的方式实现。

以element-ui的radio组件为例，可以给radio增加一个native后缀去监听原生的点击事件（不加无法监听点击），增加一个prevent后缀去除radio组件原来自带的行为来执行新的逻辑。当点击的时候，如果当前点击的选项还没有被选中过，那么给v-model绑定的值赋值为当前选中的选项的值，如果当前点击的选项已经选中了，那么v-model绑定的值就重置为空，这样就可以实现***取消radio的选中状态***的效果了。

以下是代码：

<div v-for="(item, infoIndex) in formData.hots" :key='infoIndex' class="product-item">
  <el-radio-group v-model="item.label">
    <el-radio :label="0" @click.native.prevent="clickRadioItem(0,infoIndex)">热</el-radio>
    <el-radio :label="1" @click.native.prevent="clickRadioItem(1,infoIndex)">新</el-radio>
  </el-radio-group>
</div>

data() {
  return {
    formData: {
      hots: []
    },
  };
}


methods: {
  clickRadioItem(e, index) {
    if (this.formData.hots[index].label === e) {
      this.formData.hots[index].label = null
    } else {
      this.formData.hots[index].label = e
    }
  }
}