Vue3.0+Element Plus+ts的全局loading使用
vue3.0项目中使用创建loading.tsutils/loading.tsimport { ElLoading } from ‘element-plus’;let loading: { close: () => void; };function openLoading(){loading = ElLoading.service({body: true,lock: true,text: ‘
vue3.0项目中使用
创建loading.ts
utils/loading.ts
import { ElLoading } from ‘element-plus’;
let loading: { close: () => void; };
function openLoading(){
loading = ElLoading.service({
body: true,
lock: true,
text: ‘Loading…’,
spinner: ‘el-icon-loading’,
background: ‘rgba(255, 255, 255, 0.7)’
})
}
function closeLoading(){
loading.close();
}
export {
openLoading,
closeLoading
}
在需要调用的文件中引用即可
import { openLoading, closeLoading } from ‘@/utils/loading’
export default defineComponent({
setup(props,ctx) {
const getLoading = () =>{
openLoading()
setTimeout(() => {
closeLoading()
}, 1000)
}
}
return {
getLoading
}
})
更多推荐
所有评论(0)