diff --git a/src/components/BVideo.vue b/src/components/BVideo.vue
index abb97b0..329d27b 100644
--- a/src/components/BVideo.vue
+++ b/src/components/BVideo.vue
@@ -9,8 +9,8 @@
            :autoplay="isPlay" loop>
       <p> 您的浏览器不支持 video 标签。</p>
     </video>
-    <img src="../assets/img/icon/play-white.png" class="pause" v-if="!isPlaying">
-    <div class="float" :style="{opacity: isUp?0:1}" @click="togglePlayVideo">
+    <img src="../assets/img/icon/play-white.png" class="pause" v-if="paused">
+    <div class="float" :style="{opacity: isUp?0:1}">
       <div :style="{opacity:isMove ? 0:1}" class="normal">
         <div class="toolbar mb1r">
           <div class="avatar-ctn mb4r">
@@ -97,7 +97,6 @@
         </div>
       </div>
       <div class="progress"
-           v-if="duration > 60"
            :class="progressClass"
            @touchmove="move"
            @touchend="end"
@@ -122,7 +121,7 @@ import {mapState} from "vuex";
 import Loading from "./Loading";
 
 export default {
-  name: "Video",
+  name: "BVideo",
   components: {
     BaseMarquee,
     BaseMusic,
@@ -182,6 +181,7 @@ export default {
   data() {
     return {
       loading: false,
+      paused: false,
       name: `v-${this.prefix}-${this.index}-video`,
       globalMethods: globalMethods,
       duration: 0,
@@ -217,8 +217,8 @@ export default {
     video.addEventListener('loadedmetadata', e => {
       this.videoScreenHeight = video.videoHeight / (video.videoWidth / this.width)
       this.duration = video.duration
-      if (this.duration > 60) {
-        // if (this.duration > 6) {
+      // if (this.duration > 60) {
+      if (this.duration > 6) {
         this.step = this.width / Math.floor(this.duration)
         video.addEventListener('timeupdate', fun)
       }
@@ -227,16 +227,22 @@ export default {
     let eventTester = (e, t) => {
       video.addEventListener(e, () => {
         if (e === 'playing') this.loading = false
-        if (e === 'progress') this.loading = true
-        if (e === 'waiting') this.loading = true
-        //
+        if (e === 'waiting') {
+          // console.log('paused',this.paused)
+          console.log('!this.paused ', !this.paused)
+          console.log(' !this.isPlaying', !this.isPlaying)
+          if (!this.paused && !this.isPlaying) {
+            this.loading = true
+          }
+        }
+        console.log(e, t)
       }, false);
     }
 
     // eventTester("loadstart", '客户端开始请求数据'); //客户端开始请求数据
     // eventTester("abort", '客户端主动终止下载（不是因为错误引起）'); //客户端主动终止下载（不是因为错误引起）
     // eventTester("loadstart", '客户端开始请求数据'); //客户端开始请求数据
-    eventTester("progress", '客户端正在请求数据'); //客户端正在请求数据
+    // eventTester("progress", '客户端正在请求数据'); //客户端正在请求数据
     // // eventTester("suspend", '延迟下载'); //延迟下载
     // eventTester("abort", '客户端主动终止下载（不是因为错误引起），'); //客户端主动终止下载（不是因为错误引起），
     // eventTester("error", '请求数据时遇到错误'); //请求数据时遇到错误
@@ -257,9 +263,20 @@ export default {
     // eventTester("durationchange", '资源长度改变'); //资源长度改变
     // eventTester("volumechange", '音量改变'); //音量改变
 
+    //这里不能用this.name，因为class可能还没绑上去。可以找不到dom
     let videoWrapper = new Dom(this.$refs.videoWrapper)
     videoWrapper.on('play', this.play)
     videoWrapper.on('stop', this.stop)
+    videoWrapper.on('singleClick', () => {
+      if (this.isPlaying) {
+        this.pause()
+        this.paused = true
+      } else {
+        this.play()
+        this.paused = false
+      }
+      this.loading = false
+    })
   },
   methods: {
     play() {
@@ -267,6 +284,7 @@ export default {
       new Dom(`.${this.name}-music`).trigger('start')
       // console.log('trigger-play')
       this.isPlaying = true
+      this.paused = false
       if (this.currentTime !== -1) {
         this.$refs.video.currentTime = this.currentTime
       }
@@ -278,6 +296,7 @@ export default {
       new Dom(`.${this.name}-music`).trigger('stop')
       // console.log('trigger-stop')
       this.$refs.video.pause()
+      this.paused = false
       this.isPlaying = false
       this.$refs.video.currentTime = 0
     },
@@ -288,13 +307,6 @@ export default {
       this.$refs.video.pause()
       this.isPlaying = false
     },
-    //切换视频状态
-    togglePlayVideo(e) {
-      console.log('togglePlayVideo')
-      if (!this.isPlaying) {
-        this.play()
-      }
-    },
     $likeNum(v) {
       return globalMethods.$likeNum(v)
     },
@@ -308,7 +320,6 @@ export default {
         this.isAttention = true
       }, 1000)
     },
-
     loved(e, index) {
       this.lVideo.isLoved = !this.lVideo.isLoved
       this.$emit('update:video', this.lVideo)
@@ -317,7 +328,8 @@ export default {
       this.pageX = e.touches[0].pageX
     },
     move(e) {
-      if (this.isPlaying) return
+      // console.log('move',e)
+      // if (this.isPlaying) return
       this.isMove = true
       this.pause()
       this.pageX = e.touches[0].pageX
@@ -374,7 +386,6 @@ export default {
     margin: auto;
     left: 0;
     top: 0;
-    top: 0;
     bottom: 0;
     right: 0;
     animation: pause-animation 1.1s linear;
diff --git a/src/pages/me/Uploader.vue b/src/pages/me/Uploader.vue
index 68dece9..e0a359f 100644
--- a/src/pages/me/Uploader.vue
+++ b/src/pages/me/Uploader.vue
@@ -344,25 +344,25 @@ export default {
       this.videos = {
         my: {
           list: [],
-          total: -1,
+          childs: -1,
           pageNo: 0
         },
         private: {
           list: [],
-          total: -1
+          childs: -1
         },
         like: {
           list: [],
-          total: -1
+          childs: -1
         },
         collect: {
           video: {
             list: [],
-            total: -1,
+            childs: -1,
           },
           audio: {
             list: [],
-            total: -1,
+            childs: -1,
           }
         },
       }
diff --git a/src/pages/slide/Slide.vue b/src/pages/slide/Slide.vue
index f3536f1..ab2b6b3 100644
--- a/src/pages/slide/Slide.vue
+++ b/src/pages/slide/Slide.vue
@@ -5,11 +5,11 @@
         <IndicatorHome
             v-hide="isUp"
             name="main"
-            v-model:index="index"
+            v-model:index="baseIndex"
         />
         <SlideHorizontal
             name="main"
-            v-model:index="index"
+            v-model:index="baseIndex"
             style="height: calc(100% - 5rem);"
         >
           <div class="slide-item">
@@ -40,9 +40,11 @@
                 :style="marginTop"
                 ref="virtualList"
                 :list="videos"
+                :prefix="videoPrefix[0]"
                 :renderSlide="render"
                 v-model:index="videoIndex"
                 @end="end"
+                @load-more="loadMore"
             />
           </div>
         </SlideHorizontal>
@@ -70,6 +72,7 @@ import IndicatorHome from "./IndicatorHome";
 import SlideVerticalInfinite from "./SlideVerticalInfinite";
 import Comment from "../../components/Comment";
 import enums from "../../utils/enums";
+import bus from "../../utils/bus";
 
 export default {
   name: "slide",
@@ -84,9 +87,11 @@ export default {
   },
   data() {
     return {
-      index: 0,
+      baseIndex: 0,
       videoIndex: 5,
       closeOne: true,
+      videoPrefix: ['one', 'two', 'three'],
+      loading: false,
       videos: [
         {
           "id": "034ae83b-ca0a-401a-b7c6-cf78361bae7b",
@@ -602,7 +607,6 @@ export default {
             "is_private": 0
           }
         },
-
         {
           "id": "0b1fb9c4-9d5c-40f7-9a01-1310674cbfeb",
           video: 'http://douyin.ttentau.top/7.mp4',
@@ -1449,13 +1453,13 @@ export default {
       showChangeNote: false,
       shareToFriend: false,
 
-
-      render: (item, itemIndex, play) => {
+      render: (item, itemIndex, play, prefix) => {
         return (
-            <div className={`slide-item video-slide-item video-slide-item-${itemIndex}`} data-index={itemIndex}>
+            <div class="slide-item" data-index={itemIndex}>
               <BVideo
                   isPlay={play}
                   video={item}
+                  prefix={prefix}
                   index={itemIndex}
                   onShowComments={e => this.isCommenting = true}
                   onShowShare={e => this.isSharing = true}
@@ -1483,11 +1487,20 @@ export default {
     }
   },
   created() {
-    // this.getData()
+    bus.on('singleClick', () => {
+      new Dom(`.v-${this.videoPrefix[this.baseIndex]}-${this.videoIndex}-video`).trigger('singleClick')
+    })
   },
   mounted() {
   },
   methods: {
+    loadMore() {
+      return
+      if (!this.loading) {
+        this.pageNo++
+        this.getData()
+      }
+    },
     t() {
       this.isUp = !this.isUp
     },
@@ -1497,6 +1510,7 @@ export default {
     async getData() {
       this.loading = true
       let res = await this.$api.videos.recommended({pageNo: this.pageNo, pageSize: this.pageSize})
+      console.log(res)
       this.loading = false
       if (res.code === this.SUCCESS) {
         this.totalSize = res.data.total
diff --git a/src/pages/slide/SlideHorizontal.vue b/src/pages/slide/SlideHorizontal.vue
index 101328e..d1a109a 100644
--- a/src/pages/slide/SlideHorizontal.vue
+++ b/src/pages/slide/SlideHorizontal.vue
@@ -16,7 +16,7 @@ export default {
   data() {
     return {
       wrapper: null,
-      total: 0,
+      childs: 0,
       lIndex: 0,
       wrapperWidth: 0,
       wrapperHeight: 0,
@@ -34,7 +34,7 @@ export default {
   },
   mounted() {
     this.wrapper = this.$refs.wrapper
-    this.total = this.wrapper.children.length
+    this.childs = this.wrapper.children.length
     this.wrapperWidth = this.$getCss(this.wrapper, 'width')
     this.wrapperHeight = this.$getCss(this.wrapper, 'height')
   },
@@ -58,7 +58,7 @@ export default {
       this.moveY = e.touches[0].pageY - this.startY
 
       let isRight = this.moveX < 0
-      if ((this.lIndex === 0 && !isRight) || (this.lIndex === this.total - 1 && isRight)) return
+      if ((this.lIndex === 0 && !isRight) || (this.lIndex === this.childs - 1 && isRight)) return
 
 
       this.checkDirection(e)
@@ -85,7 +85,7 @@ export default {
     },
     touchEnd(e) {
       let isRight = this.moveX < 0
-      if ((this.lIndex === 0 && !isRight) || (this.lIndex === this.total - 1 && isRight)) this.next = false
+      if ((this.lIndex === 0 && !isRight) || (this.lIndex === this.childs - 1 && isRight)) this.next = false
 
       let endTime = Date.now()
       let gapTime = endTime - this.startTime
@@ -98,19 +98,18 @@ export default {
           this.lIndex--
         }
       }
+      this.reset()
+    },
+    reset() {
       this.$setCss(this.wrapper, 'transition-duration', `300ms`)
       this.$setCss(this.wrapper, 'transform',
           `translate3d(${this.getDistance()}px, 0, 0)`)
 
-      this.$emit('update:index', this.lIndex)
-
-      this.reset()
-    },
-    reset() {
       this.moveX = 0
       this.next = false
       this.needCheck = true
       this.startTime = null
+      this.$emit('update:index', this.lIndex)
       bus.emit(this.name + '-end', this.lIndex)
     },
     getDistance() {
diff --git a/src/pages/slide/SlideVerticalInfinite.vue b/src/pages/slide/SlideVerticalInfinite.vue
index 71eb7bf..9c73d7f 100644
--- a/src/pages/slide/SlideVerticalInfinite.vue
+++ b/src/pages/slide/SlideVerticalInfinite.vue
@@ -2,6 +2,7 @@
 import bus from "../../utils/bus";
 import {mapState} from "vuex";
 import * as Vue from "vue";
+import Dom from "../../utils/dom";
 
 export default {
   props: {
@@ -9,6 +10,10 @@ export default {
       type: String,
       default: () => ''
     },
+    prefix: {
+      type: String,
+      default: () => ''
+    },
     renderSlide: {
       type: Function,
       default: () => {
@@ -33,7 +38,7 @@ export default {
   data() {
     return {
       wrapper: null,
-      total: 0,
+      childs: 0,
       lIndex: 0,
       wrapperWidth: 0,
       wrapperHeight: 0,
@@ -51,11 +56,42 @@ export default {
   computed: {
     ...mapState(['judgeValue', 'homeRefresh'])
   },
+  watch: {
+    lIndex(newVal, oldVal) {
+      new Dom(this.wrapper).find(`.v-${this.prefix}-${newVal}-video`).trigger('play')
+      setTimeout(() => {
+        new Dom(this.wrapper).find(`.v-${this.prefix}-${oldVal}-video`).trigger('stop')
+      }, 200)
+      if (newVal >= this.list.length - 3) {
+        this.$emit('load-more')
+      }
+    },
+    list(newVal, oldVal) {
+      // console.log('watch', newVal.length, oldVal.length)
+      if (oldVal.length === 0) {
+        this.insertContent()
+      } else {
+        let end = oldVal.length + 3
+        let top = $(this.wrapper).find(".slide-item:last").css('top')
+
+        newVal.slice(oldVal.length, end).map((item, index) => {
+          let el = this.getInsEl(item, oldVal.length + index)
+          //这里必须要设置个top值，不然会把前面的条目给覆盖掉
+          //2022-3-27，这里不用计算，直接用已用slide-item最后一条的top值，
+          //因为有一条情况：当滑动最后一条和二条的时候top值不会继续加。此时新增的数据如果还
+          // 计算top值的，会和前面的对不上
+          $(el).css('top', top)
+          this.wrapper.appendChild(el)
+        })
+        this.childs = this.wrapper.children.length
+        // console.log(this.childs)
+      }
+    }
+  },
   mounted() {
     this.lIndex = this.index
     this.checkChildren()
     this.insertContent()
-    this.total = this.wrapper.children.length
   },
   methods: {
     checkChildren() {
@@ -75,13 +111,13 @@ export default {
         end = this.list.length
         start = end - 5
       }
-      console.log('start', start)
-      console.log('end', end)
+      if (start < 0) start = 0
+      // console.log('start', start)
+      // console.log('end', end)
       this.list.slice(start, end).map(
           (item, index) => {
-            let el = null
             //自动播放，当前条（可能是0，可能是其他），试了下用jq来找元素，然后trigger play事件，要慢点样
-            el = this.getInsEl(item, start + index, start + index === this.lIndex)
+            let el = this.getInsEl(item, start + index, start + index === this.lIndex)
             this.wrapper.appendChild(el)
           }
       )
@@ -97,10 +133,11 @@ export default {
           }
         })
       }
+      this.childs = this.wrapper.children.length
     },
     getInsEl(item, index, play = false) {
       // console.log('index',index,play)
-      let slideVNode = this.renderSlide(item, index, play)
+      let slideVNode = this.renderSlide(item, index, play, this.prefix)
       const app = Vue.createApp({
         render() {
           return slideVNode
@@ -162,28 +199,27 @@ export default {
       let endTime = Date.now()
       let gapTime = endTime - this.startTime
       if (Math.abs(this.moveY) < 20) gapTime = 1000
-      if (Math.abs(this.moveY) > (this.wrapperHeight / 4)) gapTime = 100
+      if (Math.abs(this.moveY) > (this.wrapperHeight / 3)) gapTime = 100
       if (gapTime < 150 && this.next) {
         if (isDown) {
           this.lIndex++
         } else {
           this.lIndex--
         }
-        // console.log(this.total)
+
         let that = this
         if (isDown) {
           let addItemIndex = this.lIndex + 2
           let res = $(that.wrapper).find(`.slide-item[data-index=${addItemIndex}]`)
-          if (this.total < this.virtualTotal) {
+          if (this.childs < this.virtualTotal) {
             if (res.length === 0) {
               this.wrapper.appendChild(this.getInsEl(this.list[addItemIndex], addItemIndex))
             }
           }
-          if (this.total === this.virtualTotal
+          if (this.childs === this.virtualTotal
               && this.lIndex >= (this.virtualTotal + 1) / 2
               && this.lIndex <= this.list.length - 3
           ) {
-            // console.log(videos)
             if (res.length === 0) {
               this.wrapper.appendChild(this.getInsEl(this.list[addItemIndex], addItemIndex))
               this.appInsMap.get($(that.wrapper).find(".slide-item:first").data('index')).unmount()
@@ -193,35 +229,48 @@ export default {
               })
             }
           }
-          if (this.total > this.virtualTotal) {
-            this.appInsMap.get($(that.wrapper).find(".slide-item:first").data('index')).unmount()
+          if (this.childs > this.virtualTotal) {
             $(that.wrapper).find(".slide-item").each(function () {
+              let index = $(this).data('index')
+              if (index < (that.lIndex - 2)) {
+                that.appInsMap.get(index).unmount()
+              }
               $(this).css('top', (that.lIndex - 2) * that.wrapperHeight)
             })
           }
         } else {
+          let addItemIndex = this.lIndex - 2
+          let res = $(that.wrapper).find(`.slide-item[data-index=${addItemIndex}]`)
+
           if (this.lIndex > 1 && this.lIndex <= this.list.length - 4) {
-            let addItemIndex = this.lIndex - 2
-            this.wrapper.prepend(this.getInsEl(this.list[addItemIndex], addItemIndex))
+            if (res.length === 0) {
+              this.wrapper.prepend(this.getInsEl(this.list[addItemIndex], addItemIndex))
+              this.appInsMap.get($(that.wrapper).find(".slide-item:last").data('index')).unmount()
+              // $(that.wrapper).find(".base-slide-item:last").remove()
+              $(that.wrapper).find(".slide-item").each(function () {
+                $(this).css('top', (that.lIndex - 2) * that.wrapperHeight)
+              })
+            }
+          }
+
+          if (this.childs > this.virtualTotal) {
             this.appInsMap.get($(that.wrapper).find(".slide-item:last").data('index')).unmount()
-            // $(that.wrapper).find(".base-slide-item:last").remove()
-            $(that.wrapper).find(".slide-item").each(function () {
-              $(this).css('top', (that.lIndex - 2) * that.wrapperHeight)
-            })
           }
         }
+        this.childs = this.wrapper.children.length
       }
-      this.$setCss(this.wrapper, 'transition-duration', `300ms`)
-
-      this.$setCss(this.wrapper, 'transform',
-          `translate3d(0,${this.getDistance()}px, 0)`)
       this.reset()
     },
     reset() {
+      this.$setCss(this.wrapper, 'transition-duration', `300ms`)
+      this.$setCss(this.wrapper, 'transform',
+          `translate3d(0,${this.getDistance()}px, 0)`)
+
       this.moveX = 0
       this.next = false
       this.startTime = null
       this.needCheck = true
+      this.$emit('update:index', this.lIndex)
       bus.emit(this.name + '-end', this.lIndex)
     },
     getDistance() {
diff --git a/src/utils/mixin.js b/src/utils/mixin.js
index 758a011..643914f 100644
--- a/src/utils/mixin.js
+++ b/src/utils/mixin.js
@@ -15,6 +15,7 @@ import Loading from "../components/Loading";
 import BaseButton from "../components/BaseButton";
 import CONST_VAR from "./const_var";
 import Dom from "./dom";
+import bus from "./bus";
 
 export default {
   components: {
@@ -118,7 +119,7 @@ export default {
         let dbClickTimer = null
         let lastClickTime = null
         let dbClick = (e) => {
-          console.log('dbClick')
+          // console.log('dbClick')
           let id = 'a' + Date.now()
           let elWidth = 80
           let rotate = randomNum(0, 1)
@@ -140,7 +141,6 @@ export default {
               return 0;
           }
         }
-
         let check = (e) => {
           let checkTime = 400
           if (isDbClick) {
@@ -163,7 +163,8 @@ export default {
           } else {
             lastClickTime = nowTime;
             clickTimer = setTimeout(() => {
-              console.log('单击')
+              // console.log('单击')
+              bus.emit('singleClick')
             }, checkTime);
           }
         }