[Vuejs] 点击单选框触发两次点击事件的处理


<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'
      }
    },
}

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM