element UI组件库el-dialog内程序刷新el-dialog内组件方法

这篇具有很好参考价值的文章主要介绍了element UI组件库el-dialog内程序刷新el-dialog内组件方法。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

1、牢牢记住,vue是基于JavaScript ES6的,所以只要刷新页面里面data下的数据,页面会自动刷新的。

所以这个数据是父页面传给el-dialog的,要刷新父页面的数据,el-dialog页面内的组件就可以刷新了。

2、在页面的组件处理后台程序完成后,可以调用

that.$parent.$parent.【父页面的方法】

来刷新数据。例如:

monitorDataService.saveFileToMonitor({
  updateFile:that.updateFile,
  monitorId:that.form.monitorId
}).then(response=>{
  //完成后刷新
  if(response.code==200){
    that.$parent.$parent.getMonitorDataInfo(that.form.monitorId);
  }
});

其中,文章来源地址https://www.toymoban.com/news/detail-548788.html

that.$parent.$parent.getMonitorDataInfo就是父页面写在
methods:{}
里面的一个方法。它的主要作用就是从服务器获取数据然后将数据保存到当前页面的data中相对应的变量中。这些变量改变,组件里面的watch就可以监听到

到了这里,关于element UI组件库el-dialog内程序刷新el-dialog内组件方法的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Vue项目element-ui弹窗组件el-dialog、el-drawer,阻止点击遮罩层关闭

    效果图: 我们只需要设置这两个 属性 append-to-body :close-on-click-modal=“false” 注意 : 这里的close-on-click-modal属性前需要写入 :

    2024年02月12日
    浏览(64)
  • 如何使用element-ui相关组件如:el-select,el-table,el-switch,el-pagination,el-dialog

    element-ui 官方链接: 组件 | Element https://element.eleme.cn/#/zh-CN/component/installation userTypeOptions后端响应的对象数组数据 表格中添加模板的作用域实现 异步处理 监听status的状态 权限修改异步处理: 几个监听函数与异步请求 axios实现发送异步请求 监听弹窗

    2024年02月07日
    浏览(54)
  • 当element ui el-dialog弹窗有缓存,每次打开弹窗的时候会出问题的解决方法

    解决方法: 如下是解决方案。用el-dialog 里面有一个 destroy-on-close (关闭时销毁 Dialog 中的元素)这个完全没用。其实很简单。只需要在 el-dialog 外层加一层div 然后在 div 上写上 v-if=\\\"dialogVisible\\\"就行了。 理解: 也就是说,当显示参数 dialogVisible = true 时,先创建 el-dialog 组件,

    2024年02月04日
    浏览(50)
  • vue/Element UI 实现Element UI el-dialog 自由拖动

    前言: 最近有个项目,客户要求弹窗可拖动,但是由于elemen ui本身的弹窗并没有拖动的属性,无法满足客户的需求。 于是我百度找到了几篇文章,终于可以实现客户的需求! 请往下看↓↓ 一、新建一个目录:utils 二、创建drag .js文件 三、创建directive.js 文件 四、main.js文件中

    2024年02月02日
    浏览(66)
  • 【element-ui】el-dialog改变宽度

    dialog默认宽度为父元素的50%,这就导致在移动端会非常的窄,如图1,需要限定宽度。 解决方法:添加 custom-class 属性,然后在style中编写样式, 注意 ,如果有 scoped 限定,需要加 ::v-deep

    2024年02月11日
    浏览(58)
  • Element ui关闭el-dialog时清除数据

    如果是按叉叉关闭或者点表单以外空白处关闭的话 可以给el-dialog添加    在methods里添加函数 如果是按取消按钮清除数据,也可以给取消按钮绑定点击事件,点击取消则调用closeForm函数。 注意: 要为每个 form-item 加上 prop 属性,要不然无法清空 resetFields() 方法是重置表单,重

    2024年02月11日
    浏览(48)
  • element-ui的el-dialog,简单的封装。

    el-dialog是使用率很高的组件 使用el-dialog很多都是按照文档的例子,用一个变量控制是否显示,再来一个变量控制标题。 如果我这个对话框多个地方使用的话还要创建多个变量,甚至关闭之后还要清空一些变量,应该可以简化一点。我写vue的时候奉行的都是数据驱动,像刚才

    2024年02月12日
    浏览(54)
  • element ui中el-dialog如何自定义标题,加图标

    效果图:

    2024年02月13日
    浏览(51)
  • Element UI中el-dialog中内容超出自定义滚动条

    2.1 dialog中嵌套div,给div设置高度,并且overflow属性为auto,布局如下图: 3.1sass或less写法 3.2 原生写法

    2024年02月15日
    浏览(44)
  • element-ui:多个el-dialog弹框切换会出现闪烁

    使用多个element-ui组件el-dialog弹框切换 打开A弹框,点击关闭,紧接着打开B弹框 会出现一个明显的闪烁 给第一个弹框关闭加一点延迟 参考 【ElementUI】dialog弹窗出现闪屏问题解决办法

    2024年02月11日
    浏览(54)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包