elementui自定义loading图标

在Element UI中，您可以通过以下方式自定义Loading图标：

使用全局配置：




import { Loading } from 'element-ui';
 
// 自定义Loading图标
Loading.setDefaultOptions({
  lock: true,
  text: '加载中...',
  spinner: 'el-icon-loading', // 使用自定义图标类名
  background: 'rgba(0, 0, 0, 0.7)'
});

在调用Loading时指定选项：




const loadingInstance = Loading.service({
  lock: true,
  text: '加载中...',
  spinner: 'el-icon-my-custom-icon', // 使用自定义图标类名
  background: 'rgba(0, 0, 0, 0.7)'
});

在HTML中，您需要定义对应的图标类：




<i class="el-icon-my-custom-icon"></i>

请确保您的自定义图标类已经在全局样式文件中定义，或者是通过CSS文件正确引入。

elementui自定义loading图标

评论已关闭

推荐阅读