uniapp【优化】: 骨架屏背景问题

This commit is contained in:
15093570141
2024-11-01 09:35:56 +08:00
parent 4bbc66248f
commit 1f39493f4a
3 changed files with 15 additions and 34 deletions

View File

@@ -1,12 +1,11 @@
<template> <template>
<template v-if="props.needSkeleton"> <view v-if="props.needSkeleton" class="coreshop-skeleton">
<uv-skeletons style="padding:20rpx" class="coreshop-skeleton" :skeleton="props.skeleton" <uv-skeletons :skeleton="props.skeleton" :loading="props.skeletonLoading">
:loading="props.skeletonLoading">
<coreshop-page-content v-bind="props"> <coreshop-page-content v-bind="props">
<slot name="default" /> <slot name="default" />
</coreshop-page-content> </coreshop-page-content>
</uv-skeletons> </uv-skeletons>
</template> </view>
<template v-else> <template v-else>
<coreshop-page-content v-bind="props"> <coreshop-page-content v-bind="props">
@@ -66,24 +65,6 @@
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.coreshop-skeleton { .coreshop-skeleton {
padding: 20rpx; background-color: #fff;
}
:deep(.uv-skeleton) {
padding: 20rpx;
}
</style>
<style>
.coreshop-skeleton {
padding: 20rpx;
}
.uv-skeleton {
padding: 20rpx !important;
}
:deep(.uv-skeleton) {
padding: 20rpx !important;
} }
</style> </style>

View File

@@ -48,8 +48,6 @@
const loading = ref(true); const loading = ref(true);
const handleuQueryPageConfig = useLoadingFn(getPageConfig, loading); const handleuQueryPageConfig = useLoadingFn(getPageConfig, loading);
const state = reactive<{ const state = reactive<{
@@ -134,10 +132,3 @@
<style lang="scss" scoped> <style lang="scss" scoped>
@import './home.scss'; @import './home.scss';
</style> </style>
<style lang="scss">
.page-bg,
page {
background-color: #ffffff !important;
}
</style>

View File

@@ -1,4 +1,13 @@
export const skeleton = [ export const skeleton = [
{
type: 'flex',
num: 1,
children: [{
type: 'line',
num: 1,
style: `height:80px;background: #fff;`
}]
},
{ {
type: 'flex', type: 'flex',
num: 1, num: 1,