<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. linux学习:【第3篇】之常见命令2

    一.知识点回顾 临时:关闭当前正在运行的 /etc/init.d/iptables stop 永久:关闭开机自启动 chkonfig iptables off ll /var/log/secure # ...

  2. python继承小demo

    # -*- coding: utf-8 -*- """ 继承的意义:实现代码重用,数据函数都可以重用 子类覆盖,子类与父类同名 选择性继承 super().__init_ ...

  3. SQL server 获取异常

    一.try...... catch 获取异常信息 /*======================================== 相关错误消 息如下: ERROR_NUMBER() 返回错误号. ...

  4. 【leetcode】1250. Check If It Is a Good Array

    题目如下: Given an array nums of positive integers. Your task is to select some subset of nums, multiply ...

  5. python基础--几个特性

    1.helloword程序的解释 #!/usr/bin/python3 print("Hello, World!") 关于脚本第一行的 #!/usr/bin/python 的解释, ...

  6. Java多线程和并发(十二),Java线程池

    目录 1.利用Executors创建线程的五种不同方式 2.为什么要使用线程池 3.Executor的框架 4.J.U.C的三个Executor接口 5.ThreadPoolExecutor 6.线程 ...

  7. 信息提示框:MessageBox

    一 函数原型及参数 function MessageBox(hWnd: HWND; Text, Caption: PChar; Type: Word): Integer;   1.参数列表    hW ...

  8. Python惯例

    “惯例”这个词指的是“习惯的做法,常规的办法,一贯的做法”,与这个词对应的英文单词叫“idiom”.由于Python跟其他很多编程语言在语法和使用上还是有比较显著的差别,因此作为一个Python开发者 ...

  9. Mysql 执行安装脚本报错Changed limits:

    安装Mysql软件的时候报错,如下: [root@db bin]# ./mysql_install_db --basedir=/usr/local/mysql --datadir=/u01/app/m ...

  10. 事件总线(EventBus)

    Vue.prototype.$EventBus = new Vue() 不建议用,尽量用vuex,eventbus过于消耗浏览器资源 傻瓜版状态管理 一般的状态传递是在同时显示的情况下,倘若是在不同时 ...