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

element-ui 中修改loading加载样式

element-ui 中的 loading 加载功能,默认是全屏加载效果

设置局部,需要自定义样式或者修改样式,方法如下:

import { Loading } from 'element-ui'Vue.prototype.$baseLoading = (text) => {let loadingloading = Loading.service({lock: true,customClass: 'createLoading',  // 局部class名称text: text,spinner: 'el-icon-loading',background: 'rgba(0, 0, 0, 0)'})return loading
}<style lang="scss">.createLoading {.el-loading-spinner {top: 50%;left: 50%;margin-left: -55px;background: rgba(0, 0, 0, 0.7);padding: 20px;border-radius: 4px;width: auto;text-align: center;position: absolute;i {color: #eee;}.el-loading-text {color: #eee;}}}
</style>

重点createLoading有这个局部class名字就能控制样式的修改,有时候::v-deep在loading中不能修改样式

一些属性参数:

const loading = this.$loading({           // 声明一个loading对象lock: true,                             // 是否锁屏text: '加载中',                         // 加载动画的文字spinner: 'el-icon-loading',             // 引入的loading图标background: 'rgba(0, 0, 0, 0.8)',       // 背景颜色target: '.el-table, .table-flex, .region',  // **需要遮罩的区域,这里写要添加loading的选择器**fullscreen: false,customClass: 'loadingclass'             // **遮罩层新增类名,如果需要修改loading的样式**})

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

相关文章:

  • QT登录界面,(页面的切换)
  • 计算机毕业设计 | vue+springboot汽车销售管理系统(附源码)
  • 一款开源的原神工具箱,专为现代化 Windows 平台设计,旨在改善桌面端玩家的游戏体验
  • python日常消费数据占比分析总结年消费方向
  • MySQL变量的浮点数问题处理
  • MWeb Pro for Mac:功能强大的Markdown博客编辑器
  • 基于FPGA实现的HDMI TO MIPI扩展显示器方案
  • 2024年美国市场亚太游戏品牌数字广告洞察报告
  • DDD面试题:DDD聚合和表的对应关系是什么 ?(来自蚂蚁面试)
  • 【华为】路由策略小实验
  • docker安装elasticsearch:7.17.21
  • 10.Java对象内置结构
  • 【ITK配准】第十五期 基于运动算法的可变形配准样例
  • CSP-j 计算机硬件
  • Java中使用RediSearch进行高效数据检索
  • NASA数据集——全球土壤顶部 1 厘米土壤湿度的网格估算值25km分辨率
  • 翼支付——风控场景中图模型的范式变迁
  • Edge视频增强功能
  • C++ 概览并发
  • 04-19 周四 GitHub CI 方案设计
  • java日常选择题
  • 安卓串口通訊三
  • 嵌入式交叉编译:Unable to find arm_neon.h
  • Linux下工具tc详细讲解及限制IP和端口实例
  • Java | Leetcode Java题解之第73题矩阵置零
  • MySQL#MySql表的操作
  • git修改版本发布时间
  • 【NodeMCU实时天气时钟温湿度项目 1】连接点亮SPI-TFT屏幕和UI布局设计
  • 国内首发 | CSA大中华区启动《AI安全产业图谱(2024)》调研
  • web页面与原生android通信,调用原生android方法