Forráskód Böngészése

fix(loading): 优化加载组件样式并修复web-view参数传递

调整loading组件布局和样式,增加背景色和居中显示
修复web-view页面progress参数未传递的问题
移除web-view URL中的随机参数
whj 1 napja
szülő
commit
a1e4a7d62b
2 módosított fájl, 12 hozzáadás és 4 törlés
  1. 9 2
      components/loading.uvue
  2. 3 2
      pages/catalog/web-view.uvue

+ 9 - 2
components/loading.uvue

@@ -2,10 +2,17 @@
 
 </script>
 <template>
-  <image src="https://oss.xiaoxiongcode.com/static/home/loading.gif" class="loading-image" />
+  <view class="loading-image">
+    <image src="https://oss.xiaoxiongcode.com/static/home/loading.gif" />
+  </view>
 </template>
 <style lang="scss" scoped>
 .loading-image {
-  @apply w-full h-full object-cover fixed top-0 left-0 z-[100];
+  @apply w-full h-full fixed bg-[#000118] top-0 left-0 flex items-center justify-center;
+  z-index: 10000;
+
+  image {
+    @apply object-cover w-[70vw];
+  }
 }
 </style>

+ 3 - 2
pages/catalog/web-view.uvue

@@ -2,10 +2,12 @@
 import { ref, onMounted, watchEffect } from 'vue'
 import Loading from '@/components/loading.uvue'
 import { router } from '@/.cool'
+const progress = ref(1)
 const webviewSrc = ref('')
 var isLoading = ref(true)
 onMounted(() => {
   webviewSrc.value = router.query().src
+  progress.value = router.query().progress
 })
 function handleMessage(e) {
   var pages = getCurrentPages();
@@ -24,7 +26,6 @@ onShow(() => {
 </script>
 <template>
   <Loading v-show="isLoading" />
-  <web-view :src="webviewSrc + '?' + Math.random()" class="w-full h-full" @message="handleMessage"
-    @load="handleLoad"></web-view>
+  <web-view :src="webviewSrc" class="w-full h-full" @message="handleMessage" @load="handleLoad"></web-view>
 </template>
 <style lang="less" scoped></style>