glhcp/uniapp/components/loading-view/loading-view.vue

51 lines
767 B
Vue

<template>
<view :class="'loading ' + ( type == 'flex' ? 'flex' : '' )" :style="{backgroundColor, }">
<u-loading mode="flower" :size="60"></u-loading>
</view>
</template>
<script>
export default {
data() {
return {};
},
props: {
type: {
type: String,
default: 'fixed'
},
backgroundColor: {
type: String,
default: '#fff'
}
},
methods: {}
};
</script>
<style lang="scss" scoped>
.loading {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
z-index: 9999;
display: flex;
justify-content: center;
align-items: center;
}
.loading.flex {
position: static;
flex: 1;
width: 100%;
}
.loading {
.loading-img {
width: 100rpx;
height: 100rpx;
}
}
</style>