el-radio-group选中后再次点击取消，及el-radio-button具有边框悬浮问题解决

想达到的效果是：当前el-radio已经选中，然后再次点击这个el-radio会取消选中。
直接看代码

HTML

<el-radio-group v-model="search_overall_fdi_type">
   <el-radio-button label="cfdi" @click.native.prevent="overall_fdi_type_click('cfdi')">CFDI</el-radio-button>
   <el-radio-button label="dfdi" @click.native.prevent="overall_fdi_type_click('dfdi')">DFDI</el-radio-button>
</el-radio-group>

JS

    overall_fdi_type_click(value) {
      this.search_overall_fdi_type = value === this.search_overall_fdi_type ? '' : value
    },

然后就可以实现逻辑上的选中后再次点击会取消选中。
但是在样式上，选中和取消选中在外围会有一个悬浮框的感觉，很影响美观。所以要额外设置css

CSS

::v-deep .el-radio-button:focus:not(.is-focus):not(:active):not(.is-disabled) {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

然后就可以去掉悬浮框啦！
如图，大功告成！