123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051 |
- <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>
|