当前位置: 首页 > news >正文

解决el-radio-group只触发一次的问题

1.需求是点击合并后,出来二次确认框。现在的问题是点击完出现二次确认框后,再次点击不出来二次确认框了

2.一开始代码是这样写的

<el-radio-group v-model="unfold" size="mini" @change='changeMerge'><el-radio-button :label='1' border size="mini" class="unfold">展开</el-radio-button><el-popover placement="bottom" width="430" v-model="mergeFlag"             trigger="manual"><el-checkbox-group v-model="checkList" class="mt10" @change="handleCheckedChange"><el-checkbox label="下达人"></el-checkbox><el-checkbox label="下达日期"></el-checkbox><el-checkbox label="下达时间"></el-checkbox><el-checkbox label="评语内容"></el-checkbox></el-checkbox-group><div style="text-align: center;" class="mt20"><el-button size="mini" type="primary" @click="sureMerge">确认</el-button><el-button size="mini" @click="cancleMerge">取消</el-button></div><el-radio-button :label='2' border  size="mini" class="merge" slot="reference">合并</el-radio-button></el-popover></el-radio-group>mergeFlag:falsechangeMerge(val) {this.mergeVal = val;if (val === 2) {this.mergeFlag = true;} else {this.mergeFlag = false;}},cancleMerge() {this.mergeFlag = false},sureMerge(){this.mergeFlag = false 再写相关逻辑}

3.解决思路

  既然点了后再次点击不触发  那就重写事件 取消原来默认事件

  把原来绑在el-radio-group的事件取消掉  再el-radio-button俩个上面都绑定@click.native.prevent="changeMerge(1)"一个传1 一个传2 这样就触发了

原来想的是用el-button来写,试过el-button点多少次都会触发二次确认框  但是你更改其样式为el-radio-button的样式 工程量比较大 所以没深研究

http://www.lryc.cn/news/284117.html

相关文章:

  • openssl3.2 - 官方demo学习 - pkey - EVP_PKEY_RSA_keygen.c
  • 密码搜|Facebook 8组问答,搞定Pixel与广告之间的关系!
  • Apache StringUtils:Java字符串处理工具类
  • 设计模式 代理模式(静态代理 动态代理) 与 Spring Aop源码分析 具体是如何创建Aop代理的
  • 【EI会议征稿通知】第七届先进电子材料、计算机与软件工程国际学术会议(AEMCSE 2024)
  • Verilog基础:强度建模(一)
  • Spring Boot各类变量的使用
  • Hive管理UDF详解
  • bug笔记:解决 HTTP Error 500.30 - ASP.NET Core app failed to start
  • 理解pytorch系列:transpose是怎么实现的
  • Linux tftp命令教程:文件传输利器(附案例详解和注意事项)
  • beego的模块篇 - task任务
  • ThreadLocal工具类
  • 【c语言】扫雷(上)
  • Java读取制表符文本转换为JSON
  • 从C到C++:向面向对象过渡的技巧与诀窍
  • Vue3中动态组件使用
  • kubernetes工作负载-DamonSet
  • zabbix其他配置
  • 蓝桥杯备战 每日一题 (2)
  • GetShell的姿势
  • workflow源码解析:ThreadTask
  • 为何谷歌强制要求安装ssl证书?
  • 【刷题】 leetcode 2 .两数相加
  • Webpack5入门到原理2:基本使用
  • 企业微信上传临时素材errcode:44001,errmsg:empty media data
  • Docker技巧汇总
  • 学习使用微信小程序实现智能名片电子名片功能代码
  • 学习响应式编程中遇到的奇奇怪怪的问题
  • 前端常用js、css效果