fix: 🐛 修复 Swiper 在微信小程序平台轮播视频时在iOS平台全屏展示异常的问题 (#898)

✅ Closes: #885

Author: Moonofweisheng

src/components/demo-block/demo-block.vue

@@ -1,12 +1,3 @@
-<!--
- * @Author: weisheng
- * @Date: 2023-08-01 11:12:05
- * @LastEditTime: 2024-07-11 19:13:17
- * @LastEditors: weisheng
- * @Description: 
- * @FilePath: \wot-design-uni\src\components\demo-block\demo-block.vue
- * 记得注释
--->
 <template>
   <view :class="['demo-block', transparent ? '' : 'is-white', customClass]">
     <view class="demo-title">{{ title }}</view>
@@ -69,7 +60,6 @@ function setStyle() {
 }
 
 .demo-block {
-  position: relative;
   color: #666;
 
   &:not(:first-child) {

src/uni_modules/wot-design-uni/components/wd-swiper/wd-swiper.vue

@@ -1,53 +1,59 @@
 <template>
   <view :class="`wd-swiper ${customClass}`" :style="customStyle">
-    <swiper
-      :adjust-height="adjustHeight"
-      :adjust-vertical-height="adjustVerticalHeight"
-      class="wd-swiper__track"
-      :autoplay="autoplay && !videoPlaying"
-      :current="navCurrent"
-      :interval="interval"
-      :duration="duration"
-      :circular="loop"
-      :vertical="direction == 'vertical'"
-      :easing-function="easingFunction"
-      :previous-margin="addUnit(previousMargin)"
-      :next-margin="addUnit(nextMargin)"
-      :snap-to-edge="snapToEdge"
-      :display-multiple-items="displayMultipleItems"
-      :style="{ height: addUnit(height) }"
-      @change="handleChange"
-      @animationfinish="handleAnimationfinish"
-    >
-      <swiper-item v-for="(item, index) in list" :key="index" class="wd-swiper__item">
-        <video
-          v-if="isVideo(item)"
-          :id="`video-${index}-${uid}`"
-          :style="{ height: addUnit(height) }"
-          :src="isObj(item) ? item[valueKey] : item"
-          :poster="isObj(item) ? item.poster : ''"
-          :class="`wd-swiper__video ${customItemClass} ${getCustomItemClass(currentValue, index, list)}`"
-          @play="handleVideoPaly"
-          @pause="handleVideoPause"
-          :enable-progress-gesture="false"
-          :loop="videoLoop"
-          :muted="muted"
-          :autoplay="autoplayVideo"
-          objectFit="cover"
-          @click="handleClick(index, item)"
-        />
-        <image
-          v-else
-          :src="isObj(item) ? item[valueKey] : item"
-          :class="`wd-swiper__image ${customImageClass} ${customItemClass} ${getCustomItemClass(currentValue, index, list)}`"
-          :style="{ height: addUnit(height) }"
-          :mode="imageMode"
-          @click="handleClick(index, item)"
-        />
+    <!-- #ifdef MP-WEIXIN -->
+    <scroll-view scroll-x scroll-y style="width: 100%; height: 100%">
+      <!-- #endif -->
+      <swiper
+        :adjust-height="adjustHeight"
+        :adjust-vertical-height="adjustVerticalHeight"
+        class="wd-swiper__track"
+        :autoplay="autoplay && !videoPlaying"
+        :current="navCurrent"
+        :interval="interval"
+        :duration="duration"
+        :circular="loop"
+        :vertical="direction == 'vertical'"
+        :easing-function="easingFunction"
+        :previous-margin="addUnit(previousMargin)"
+        :next-margin="addUnit(nextMargin)"
+        :snap-to-edge="snapToEdge"
+        :display-multiple-items="displayMultipleItems"
+        :style="{ height: addUnit(height) }"
+        @change="handleChange"
+        @animationfinish="handleAnimationfinish"
+      >
+        <swiper-item v-for="(item, index) in list" :key="index" class="wd-swiper__item">
+          <video
+            v-if="isVideo(item)"
+            :id="`video-${index}-${uid}`"
+            :style="{ height: addUnit(height) }"
+            :src="isObj(item) ? item[valueKey] : item"
+            :poster="isObj(item) ? item.poster : ''"
+            :class="`wd-swiper__video ${customItemClass} ${getCustomItemClass(currentValue, index, list)}`"
+            @play="handleVideoPaly"
+            @pause="handleVideoPause"
+            :enable-progress-gesture="false"
+            :loop="videoLoop"
+            :muted="muted"
+            :autoplay="autoplayVideo"
+            objectFit="cover"
+            @click="handleClick(index, item)"
+          />
+          <image
+            v-else
+            :src="isObj(item) ? item[valueKey] : item"
+            :class="`wd-swiper__image ${customImageClass} ${customItemClass} ${getCustomItemClass(currentValue, index, list)}`"
+            :style="{ height: addUnit(height) }"
+            :mode="imageMode"
+            @click="handleClick(index, item)"
+          />
 
-        <text v-if="isObj(item) && item[textKey]" :class="`wd-swiper__text ${customTextClass}`" :style="customTextStyle">{{ item[textKey] }}</text>
-      </swiper-item>
-    </swiper>
+          <text v-if="isObj(item) && item[textKey]" :class="`wd-swiper__text ${customTextClass}`" :style="customTextStyle">{{ item[textKey] }}</text>
+        </swiper-item>
+      </swiper>
+      <!-- #ifdef MP-WEIXIN -->
+    </scroll-view>
+    <!-- #endif -->
 
     <template v-if="indicator">
       <slot name="indicator" :current="currentValue" :total="list.length"></slot>