element-ui 中的 loading 加载功能,默认是全屏加载效果,文章来源:https://www.toymoban.com/news/detail-678628.html
设置局部,需要自定义样式,自定义的方法如下:文章来源地址https://www.toymoban.com/news/detail-678628.html
import { Loading } from 'element-ui'
Vue.prototype.$baseLoading = (text) => {
let loading
loading = 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>
到了这里,关于element-ui 自定义loading加载样式的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!