【elementUI】【radio】【vue3】 点击再点击 取消和选中

1、radio单用 想要重复点击选中取消选中两个状态切换的设置

Radio | Element Plus (element-plus.org)

 

我们要利用@click.prevent 定义这个事件

  <el-radio-group v-model="radio">

  <el-radio  :label="3"   @click.prevent="radioChange(3)"
             class="mr-5" style="height: 50px" size="large" border >结合个人信息</el-radio>
  </el-radio-group>

然后编写这个事件的方法 （首先你要在data里return radio 或者其它方式）

 radioChange (e) {
      e === this.radio ? (this.radio = "") : (this.radio = e);
    },

 通过传过来的e值与设置的radio值比较 （这里设定是如果相等则让radio为空（不选中），否则就让radio为这个传过来的值（ 选中），之后就会循环往复：为这个传过来的值e，为空.....）

总结：通过以上方法实现了radiobutton的单个使用，虽然javajframe里的直接用，但这个官网好像没给说明（应该是觉得太简单了）

来源：

(122条消息) element plus中el-radio选中之后再次点击取消选中_el-radio取消选中_青衣浏阳的博客-CSDN博客