vue 数据大屏项目开发中需要使用Loading组件,但是项目是个超大屏,element UI Loading提供的样式字体太小了,我们需要改大一些。
vue2项目
element ui组件
添加自定义类
这里我们添加一个自定义类
// 设置了5秒 可以按需配置
openFullScreen2() {
const loading = this.$loading({
lock: true,
text: '加载中...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)',
customClass: 'custom-loading' // 添加自定义类名
});
setTimeout(() => {
loading.close();
}, 5000);
}
给自定义类添加样式
<style lang="scss">
.custom-loading .el-icon-loading {
font-size: 180px;
}
.custom-loading .el-loading-text {
font-size: 120px;
margin-top: 30px;
}
</style>