<el-radio-group v-model="uploadStatus" class="upload-status-radio">
<el-radio label="0" class="green" @click.native="clickRadio($event, 0)">成功</el-radio>
<el-radio label="1" class="red" @click.native="clickRadio($event, 1)">失败</el-radio>
</el-radio-group>
data () {
return {
uploadStatus: '-1'
}
},
methods: {
/**
* 点击单选框取消选中状态的处理
* @param e 原生e
* @param index
*/
clickRadio (e, index) {
if (e.target.tagName === 'INPUT') return // 因为原生click事件会执行两次,第一次在label标签上,第二次在input标签上,故此处理
if (this.uploadStatus === index.toString()) {
this.uploadStatus = '-1'
}
},
}

[Vuejs] 点击单选框触发两次点击事件的处理的更多相关文章

  1. zepto.js 的tap事件中点击一次触发两次事件

    html代码: <div class="xh-lxx-cart-count1"> <span class="minus">-</s ...

  2. 商务系统的构造思路(无源码!)+如何用jsp实现点击单选框内容显示在另一个jsp页面

    敲码经验总结: 之前犯了一个错误就是,没有从底层开始学起,有啥问题,就直接博客园找源码,去CSDN找源代码,看到代码就复制粘贴,结果从新梳理知识点的时候,貌似除了复制粘贴,印象深刻的知识啥也没学到. ...

  3. wxpython中单选框的两种创建方式源码展示

    #coding=utf-8 import wx class MyFrame(wx.Frame): def __init__(self): wx.Frame.__init__(self,None,-1, ...

  4. 解决label点击事件触发两次问题

    问题描述: 通常,为了用户体验,我们点击单选框或者复选框后面文字,即可选中当前项.代码如下: <label> <input type="radio" name=& ...

  5. element-ui 带单选框的表格

    效果:不只是带单选框,点击当前行单选框选中状态网上查了一些发现很多都是只能点击当前radio选中当前行,配合element-ui的单选table时发现两个的选择状态是不一致的,所以调整了一下效果 提供 ...

  6. WPF中单选框RadioButton

    单选框RadioButton的基本使用: <StackPanel Margin="10"> <Label FontWeight="Bold"& ...

  7. JavaScript---网络编程(11)--DHTML技术演示(4)-单选框/下拉菜单/添加文件

    本节讲述单选框/下拉菜单/添加文件,综合css,html和JavaScript. 单选框: 实现的功能是:(类似平时的性格测试) 先隐藏一部分页面,然后通过点击单选框来显示. 再通过选项的选择-(每个 ...

  8. PyQt4 的部件 -- CheckBox 单选框

    单选框具有两种状态:被选中或未被选中. 当用户选择或者取消选择时,单选框就会发射一个stateChanged()信号 # QCheckBox 单选框 # 本例创建一个用来改变窗口标题的单选框 impo ...

  9. PyQt4单选框QCheckBox

    PyQt4中的部件 部件是构建应用程序的基础元素.PyQt4工具包拥有大量的种类繁多的部件.比如:按钮,单选框,滑块,列表框等任何程序员在完成其工作时需要的部件. QCheckBox单选框 单选框具有 ...

随机推荐

  1. mysql绿色版的应用

    一.首先下载mysql 1.进入 https://www.oracle.com/index.html 网址 2.拉倒页面的最下面 3. 4.把下好的压缩文件解压出来 二.在DOS命令里面配置 1.先进 ...

  2. 跨站请求伪造(csrf),django的settings源码剖析,django的auth模块

    目录 一.跨站请求伪造(csrf) 1. 什么是csrf 2. 钓鱼网站原理 3. 如何解决csrf (1)思路: (2)实现方法 (3)实现的具体代码 3. csrf相关的装饰器 (1)csrf_p ...

  3. selenium Error

    点击下载对应版本的 chromedriver.exe Message: 'geckodriver' executable needs to be in PATH. 原因是没有配置chromedrive ...

  4. Python 文件I/OⅡ

    File对象的属性 一个文件被打开后,你有一个file对象,你可以得到有关该文件的各种信息. 以下是和file对象相关的所有属性的列表: 如下实例: 以上实例输出结果: close()方法 File ...

  5. CSS3的多列属性

    CSS3 可以将文本内容设计成像报纸一样的多列布局 ㈠CSS3 多列属性 ㈡column-count 属性 ⑴语法:column-count: number|auto; ⑵值:          ㈢c ...

  6. css动画速度与三次贝赛尔曲线

      今天要说的是css的动画曲线.   首先要说的是语法: value: 1.linear:线性动画,也就是匀速,以相同的速度开始以相同的速度结束. 2.ease:默认的动画效果,特点是先快后慢,时间 ...

  7. docker安装mysql5.6和redis3.2

    环境:centos 6.8, docker version 1.7.1 1.docker安装mysql5.6 第一步:拉取镜像 docker pull mysql:5.6 第二步:docker run ...

  8. [JZOJ6244]【NOI2019模拟2019.7.1】islands【计数】【图论】

    Description n<=1e9,M,K<=100 Solution 显然任选m个港口的答案是一样的,乘个组合数即可. 考虑枚举m个港口的度数之和D 可以DP计算 记\(F_{m,D} ...

  9. latex参考文献中作者名字含有特殊字符怎么办

  10. JavaWeb_(设计模式)单例模式

    菜鸟教程 传送门 单例模式(Singleton Pattern)是 Java 中最简单的设计模式之一.这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式. 这种模式涉及到一个单一的类,该 ...