转场

src/views/coursewarePlay/index.tsx

@@ -235,6 +235,7 @@ export default defineComponent({
       popupData.itemName = item.name
       nextTick(() => {
         data.itemList = list
+        checkedAnimation(popupData.activeIndex)
         postMessage({
           api: 'courseLoading',
           content: {
@@ -520,19 +521,12 @@ export default defineComponent({
     // 轮播切换
     const handleSwipeChange = (index: number) => {
       if (popupData.activeIndex == index) return
-      const oldIndex = popupData.activeIndex
+      checkedAnimation(popupData.activeIndex)
       popupData.activeIndex = index
       handleStop()
       clearTimeout(acitveTimer.value)
 
       const item = data.itemList[index]
-      const oldItem = data.itemList[oldIndex]
-      if (item) {
-        const preItem = data.itemList[index - 1]
-        const nextItem = data.itemList[index + 1]
-        preItem && (preItem.isAnimation = item.knowledgePointId == preItem.knowledgePointId && oldItem?.adviseStudyTimeSecond < 8 ? false : true)
-        nextItem && (nextItem.isAnimation = item.knowledgePointId == nextItem.knowledgePointId && oldItem?.adviseStudyTimeSecond < 8 ? false : true)
-      }
       acitveTimer.value = setTimeout(
         () => {
           if (item) {
@@ -561,6 +555,16 @@ export default defineComponent({
       )
     }
 
+    /** 是否有转场动画 */
+    const checkedAnimation = (index: number) => {
+      const oldItem = data.itemList[index]
+      const preItem = data.itemList[index - 1]
+      const nextItem = data.itemList[index + 1]
+      preItem && (preItem.isAnimation = oldItem.knowledgePointId == preItem.knowledgePointId && oldItem?.adviseStudyTimeSecond < 8 ? false : true)
+      nextItem && (nextItem.isAnimation = oldItem.knowledgePointId == nextItem.knowledgePointId && oldItem?.adviseStudyTimeSecond < 8 ? false : true)
+      console.log(preItem?.isAnimation, nextItem?.isAnimation)
+    }
+
     // 上一个知识点, 下一个知识点
     const handlePreAndNext = (type: string) => {
       if (type === 'up') {
@@ -603,7 +607,7 @@ export default defineComponent({
                         : mIndex > popupData.activeIndex
                         ? effects[effectIndex.value].next
                         : (effects[effectIndex.value] as any).current),
-                      ...(m.isAnimation ? {} : { 'transition-duration': '0s' })
+                      ...(m.isAnimation ? {} : { 'transition-duration': '0s'})
                     }}
                     onClick={(e: Event) => {
                       e.stopPropagation()