VUE element-ui之Dialog对话框关闭事件

简介: VUE element-ui之Dialog对话框关闭事件

步骤:

在标签中定义事件

 <el-dialog
        :title="title"
        :close-on-click-modal="false"
        :visible.sync="annularPopup"
        width="60%"
        center
        @close="closeDialog"
      >

js调用方法即可

closeDialog() {
      this.$refs.tableList.clearSort()//此方法为重置排序选中状态
    },

ref定义在表格开始标签中

 <el-table
          ref="tableList"
          :data="tableData"
        >

关闭dialog执行closeDialog()方法重置排序选中状态
排序选中状态在这里插入图片描述

相关文章
|
1月前
|
JavaScript 开发者
|
1月前
|
JavaScript
Vue组件点击事件不触发的问题,添加事件修饰符native解决
Vue组件点击事件不触发的问题,添加事件修饰符native解决
266 0
|
2月前
|
JavaScript 前端开发
vue-day03 v-on事件处理,表单输入绑定
文章介绍了Vue.js中事件处理和表单输入绑定的使用。包括v-on指令监听事件、事件处理方法、内联处理器、访问原生DOM事件、事件修饰符、按键修饰符、系统修饰符、exact修饰符和鼠标按钮修饰符。同时,讲解了如何使用v-model实现单行文本、多行文本、复选框和单选按钮的双向数据绑定,并提供了修饰符的使用示例。这些特性使得Vue.js在处理表单输入和事件时更加灵活和方便。
vue-day03 v-on事件处理,表单输入绑定
|
2月前
|
JavaScript
Vue在子组件中判断父组件是否传来事件
本文介绍了在Vue中如何通过`vm.$listeners`对象来判断父组件是否传递了特定的事件给子组件,并展示了如何检查事件是否存在以及相应的处理方法。
187 0
Vue在子组件中判断父组件是否传来事件
|
3月前
|
编解码 前端开发 vr&ar
从零开始的PICO教程(4)--- UI界面绘制与响应事件
这篇文章是PICO开发系列教程的第四部分,主要介绍了如何在PICO 4 VR环境中创建UI界面,包括Canvas和Panel的配置、UI元素的绘制、以及Button和Slider的事件响应绑定,并通过示例展示了数字增减和滑块功能的具体实现。
从零开始的PICO教程(4)--- UI界面绘制与响应事件
|
3月前
Vue3对话框(Dialog)
该 Vue2 对话框组件提供丰富的可定制属性,如标题、内容、宽度、高度等,并支持自定义按钮文本和样式。其预览效果展示了多种使用场景,包括全屏切换、加载状态及自定义样式等。该组件适用于各种需要弹窗功能的应用场景。[在线预览](https://themusecatcher.github.io/vue-amazing-ui/guide/components/dialog.html)提供了更多实例。此文章详情见原文链接,若涉及版权问题,请告知以便删除。
139 1
Vue3对话框(Dialog)
|
2月前
|
JavaScript
vue学习(10)事件修饰符
vue学习(10)事件修饰符
42 3
|
2月前
|
JavaScript
vue学习(9)事件处理
vue学习(9)事件处理
57 2
|
3月前
|
JavaScript 前端开发 UED
深入了解 Vue 事件处理
【8月更文挑战第4天】
56 13
|
3月前
|
JavaScript
Vue学习之--------事件的基本使用、事件修饰符、键盘事件(2022/7/7)
这篇文章是关于Vue事件处理的学习指南,包括事件的基本使用、事件修饰符和键盘事件。文中首先介绍了事件的基本使用方法,包括使用`v-on:xxx`或`@xxx`绑定事件,以及在`methods`对象中配置回调函数。然后,文章通过代码实例和测试效果,展示了如何使用事件修饰符来增强事件处理的功能,例如阻止默认行为、阻止事件冒泡等。最后,文章还介绍了Vue中的键盘事件处理,包括常用的按键别名和系统修饰键的使用,并通过代码示例展示了如何检测特定按键的按下。整篇文章通过详细的代码实例和清晰的测试效果截图,帮助读者理解和掌握Vue中事件处理的相关知识点。
Vue学习之--------事件的基本使用、事件修饰符、键盘事件(2022/7/7)