动画透明度

src/views/coursewarePlay/index.tsx

@@ -453,34 +453,42 @@ export default defineComponent({
     const effects = [
       {
         prev: {
-          transform: 'translate3d(0, 0, -800px) rotateX(180deg)'
+          transform: 'translate3d(0, 0, -800px) rotateX(180deg)',
+          opacity: 0
         },
         next: {
-          transform: 'translate3d(0, 0, -800px) rotateX(-180deg)'
+          transform: 'translate3d(0, 0, -800px) rotateX(-180deg)',
+          opacity: 0
         }
       },
       {
         prev: {
-          transform: 'translate3d(-100%, 0, -800px)'
+          transform: 'translate3d(-100%, 0, -800px)',
+          opacity: 0
         },
         next: {
-          transform: 'translate3d(100%, 0, -800px)'
+          transform: 'translate3d(100%, 0, -800px)',
+          opacity: 0
         }
       },
       {
         prev: {
-          transform: 'translate3d(-50%, 0, -800px) rotateY(80deg)'
+          transform: 'translate3d(-50%, 0, -800px) rotateY(80deg)',
+          opacity: 0
         },
         next: {
-          transform: 'translate3d(50%, 0, -800px) rotateY(-80deg)'
+          transform: 'translate3d(50%, 0, -800px) rotateY(-80deg)',
+          opacity: 0
         }
       },
       {
         prev: {
-          transform: 'translate3d(-100%, 0, -800px) rotateY(-120deg)'
+          transform: 'translate3d(-100%, 0, -800px) rotateY(-120deg)',
+          opacity: 0
         },
         next: {
-          transform: 'translate3d(100%, 0, -800px) rotateY(120deg)'
+          transform: 'translate3d(100%, 0, -800px) rotateY(120deg)',
+          opacity: 0
         }
       },
       //风车4