diff --git a/src/App.vue b/src/App.vue
index 9bb5cc1..cc2761f 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -113,12 +113,12 @@ export default {
 }
 </script>
 <style lang="less">
-
-.base-slide-item {
-  min-width: 100vw;
-  min-height: 100vh;
-  position: relative;
-}
+//
+//.base-slide-item {
+//  min-width: 100vw;
+//  min-height: 100vh;
+//  position: relative;
+//}
 
 #app {
   height: 100%;
diff --git a/src/assets/img/icon/loved - 副本.svg b/src/assets/img/icon/loved - 副本.svg
new file mode 100644
index 0000000..e03e9b6
--- /dev/null
+++ b/src/assets/img/icon/loved - 副本.svg	
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1539708547888" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1476" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M739.584 70.592c-92.224 0-177.792 63.04-228.224 109.568C460.864 133.632 375.36 70.592 283.008 70.592 108.48 70.592 0 176.96 0 348.16 0 492.8 130.688 608.256 131.2 608.64l340.544 328.512c10.432 10.432 24.448 16.256 39.552 16.256s29.056-5.824 39.296-16l341.248-328.64c30.656-29.376 130.752-134.848 130.752-260.544C1022.656 176.96 914.176 70.592 739.584 70.592z" p-id="1477" fill="#e73a57"></path></svg>
\ No newline at end of file
diff --git a/src/assets/video/1.mp4 b/src/assets/video/1.mp4
index 811afc5..1d2ef76 100644
Binary files a/src/assets/video/1.mp4 and b/src/assets/video/1.mp4 differ
diff --git a/src/components/Video.vue b/src/components/Video.vue
index f2df4a9..f871084 100644
--- a/src/components/Video.vue
+++ b/src/components/Video.vue
@@ -1,13 +1,7 @@
-<!--<template>-->
-<!--  <video style="height: 100vh;width: 100vw;" :src="video.videoUrl" :poster="video.poster" refs="video" muted :autoplay="!disabled" loop>-->
-<!--    <p> 您的浏览器不支持 video 标签。</p>-->
-<!--  </video>-->
-<!--</template>-->
 <template>
-  <div class="bg-video" v-bind:style="{'height':height+'px'}">
+  <div class="bg-video">
     <!--    <video :src="video.videoUrl" poster="../assets/img/icon/components/video/loading.gif" ref="video" muted :autoplay="play" loop>-->
     <!--    poster="../assets/img/poster/1.jpg"-->
-
     <video :src="video.video"
            :poster="video.origin_cover"
            ref="video"
@@ -24,7 +18,7 @@
         <div :style="{opacity:isMove?0:1}" class="normal">
           <div class="toolbar mb1r">
             <div class="avatar-ctn mb2r">
-              <img class="avatar" :src="lVideo.author.avatar"  alt=""
+              <img class="avatar" :src="lVideo.author.avatar" alt=""
                    @click.stop="$emit('goUserInfo')">
               <transition name="fade">
                 <div v-if="!isAttention" @click.stop="attention" class="options" ref="attention-option">
@@ -71,10 +65,15 @@
             <div class="description mb1r">
               {{ lVideo.desc }}
             </div>
-            <div class="music " @click.stop="$nav('/music')">
+            <div class="music" @click.stop="$nav('/music')">
               <img src="../assets/img/icon/music.svg" alt="" class="music-image">
-              <!--              <marquee behavior=scroll direction=left align=middle scrollamount=4> 吴三二 - 光年之外</marquee>-->
-              <div behavior=scroll direction=left align=middle scrollamount=4> {{ lVideo.music.title }}</div>
+              <!--              <marquee behavior=scroll direction=left align=middle scrollamount=4>{{ lVideo.music.title }}</marquee>-->
+              <!--              <div class="marquee" behavior=scroll direction=left align=middle scrollamount=4>-->
+              <!--                {{ lVideo.music.title }}-->
+              <!--              </div>-->
+              <div class="marquee">
+                <p> {{ lVideo.music.title }}{{ lVideo.music.title }}</p>
+              </div>
             </div>
           </div>
           <div v-else class="comment-status">
@@ -99,8 +98,8 @@
           </div>
         </div>
         <div class="process"
-             :class="isMove ? '' : isPlaying && 'stop'"
              v-if="duration > 60"
+             :class="isMove ? '' : isPlaying && 'stop'"
              @touchmove="move"
              @touchend="end"
         >
@@ -334,6 +333,8 @@ export default {
   position: relative;
   background: black;
   font-size: 1.4rem;
+  width: 100%;
+  height: 100%;
 
   video {
     width: 100%;
@@ -551,9 +552,35 @@ export default {
             }
 
             marquee {
-              margin-left: 10px;
+              margin-left: 1rem;
+            }
+
+            .marquee {
+              color: white;
+              width: 100%;
+              overflow: hidden;
+              position: relative;
             }
 
+            .marquee p {
+              margin: 0;
+              padding-left: 100%;
+              display: inline-block;
+              white-space: nowrap;
+              animation-name: marquee;
+              animation-timing-function: linear;
+              animation-duration: 5s;
+              animation-iteration-count: infinite;
+            }
+
+            @keyframes marquee {
+              from {
+                transform: translate(0%);
+              }
+              to {
+                transform: translate(-100%);
+              }
+            }
           }
         }
 
diff --git a/src/components/slide/SlideItem.vue b/src/components/slide/SlideItem.vue
index 5b3ee9e..431db97 100644
--- a/src/components/slide/SlideItem.vue
+++ b/src/components/slide/SlideItem.vue
@@ -10,10 +10,11 @@ export default {
 }
 </script>
 
-<style scoped lang="less">
+<style lang="less">
 .base-slide-item {
-  min-width: 100vw;
+  //min-width: 100vw;
   //min-height: 100vh;
+  min-width: 100%;
   min-height: 100%;
   position: relative;
 }
diff --git a/src/pages/Test2.vue b/src/pages/Test2.vue
index abd4a06..2e8f057 100644
--- a/src/pages/Test2.vue
+++ b/src/pages/Test2.vue
@@ -9,7 +9,7 @@
 </template>
 <script>
 
-import mp40 from "../assets/video/0.mp4";
+import mp40 from "../assets/video/1.mp4";
 
 export default {
   name: "Test",
diff --git a/src/pages/Test3.vue b/src/pages/Test3.vue
index a7b5245..8e27605 100644
--- a/src/pages/Test3.vue
+++ b/src/pages/Test3.vue
@@ -1,6 +1,5 @@
 <template>
-  <div class="test" @click="click">
-    <img class="left" src="../assets/img/icon/loved.svg" alt="">
+  <div class="test" v-top-love>
   </div>
 </template>
 <script>
@@ -10,6 +9,36 @@ export default {
   name: "Test",
   props: {},
   components: {},
+  directives: {
+    topLove: {
+      beforeMount(el, binding, vNode) {
+        let click = function (e) {
+          let id = 'a' + Date.now()
+          let elWidth = 80
+          let rotate = randomNum(0, 1)
+          let template = `<img class="${rotate ? 'left' : 'right'}" id="${id}" src="${require('../assets/img/icon/loved.svg')}" alt="">`
+          let el = new Dom().create(template)
+          el.css({top: e.y - elWidth, left: e.x - elWidth / 2,})
+          new Dom().find('.test').append(el)
+
+          setTimeout(() => {
+            new Dom().find(`#${id}`).remove()
+          }, 1000)
+        }
+        let randomNum = function (minNum, maxNum) {
+          switch (arguments.length) {
+            case 1:
+              return parseInt(Math.random() * minNum + 1, 10);
+            case 2:
+              return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10);
+            default:
+              return 0;
+          }
+        }
+        el.addEventListener('click', click)
+      }
+    }
+  },
   data() {
     return {
       showShareDialog: true,
@@ -93,7 +122,7 @@ export default {
         transform: @scale rotate(0-@rotate);
       }
       100% {
-        transform: translateY(-10rem) scale(2) rotate(0-@rotate);
+        transform: translateY(-12rem) scale(2) rotate(0-@rotate);
         opacity: 0;
       }
     }
@@ -115,7 +144,7 @@ export default {
         transform: @scale rotate(0+@rotate);
       }
       100% {
-        transform: translateY(-10rem) scale(2) rotate(0+@rotate);
+        transform: translateY(-12rem) scale(2) rotate(0+@rotate);
         opacity: 0;
       }
     }
diff --git a/src/pages/Test4.vue b/src/pages/Test4.vue
new file mode 100644
index 0000000..f835134
--- /dev/null
+++ b/src/pages/Test4.vue
@@ -0,0 +1,113 @@
+<template>
+  <div class="Test">
+    <div class="content1">
+      <div style="width: 50%;">
+        <div class="marquee">
+          <span class="content">{{ text }}<span class="content-space"></span></span>
+        </div>
+      </div>
+      <base-button @click="pause">stop</base-button>
+      <base-button @click="start">start</base-button>
+    </div>
+  </div>
+</template>
+<script>
+
+import BaseButton from "../components/BaseButton";
+
+export default {
+  name: "Test4",
+  components: {BaseButton},
+  props: {
+    text: {
+      type: String,
+      default: '跑马灯测试。跑马灯测试。跑马灯测试。'
+    }
+  },
+  data() {
+    return {
+      timer: null,
+      contentWidth: 0,
+      transformX: 0,
+      $marqueeContent: null,
+    }
+  },
+  methods: {
+    pause() {
+      cancelAnimationFrame(this.timer)
+    },
+    start() {
+      if (this.contentWidth <= 0) { // 没有内容搞什么动画
+        return;
+      }
+      let fn = () => {
+        if (this.transformX > (-this.contentWidth / 3)) {
+          this.transformX -= 2
+          this.$marqueeContent.style.transform = `translate3d(${this.transformX}px,0,0)`
+        } else {
+          this.transformX = 0
+        }
+        this.timer = requestAnimationFrame(fn)
+      }
+      // this.timer = requestAnimationFrame(fn);
+      fn()
+    }
+  },
+  mounted() {
+    let speed = 150; // 速度 -- px每秒
+
+    let $marquee = document.querySelector('.marquee');
+    let $marqueeContent = this.$marqueeContent = $marquee.querySelector('.content');
+    // 内容复制3份好有连续性
+    $marqueeContent.innerHTML = $marqueeContent.innerHTML + $marqueeContent.innerHTML + $marqueeContent.innerHTML
+    this.contentWidth = $marqueeContent.getBoundingClientRect().width;
+    this.start()
+  }
+}
+</script>
+
+<style scoped lang="less">
+@import "../assets/scss/index";
+
+.Test {
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  overflow: auto;
+  font-size: 1.4rem;
+  color: white;
+
+  .content1 {
+    padding-top: 6rem;
+
+    .marquee {
+      width: 100%;
+      height: 4rem;
+      line-height: 4rem;
+      display: block;
+      margin: 0 auto;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: clip;
+      position: relative;
+    }
+
+    .marquee .content {
+      color: white;
+      display: inline-block;
+      position: relative;
+      white-space: nowrap;
+    }
+
+    .marquee .content-space {
+      display: inline-block;
+      width: 3rem;
+    }
+
+  }
+
+
+}
+</style>
diff --git a/src/pages/home/Index2.vue b/src/pages/home/Index2.vue
index 714f1a7..fb292e0 100644
--- a/src/pages/home/Index2.vue
+++ b/src/pages/home/Index2.vue
@@ -6,6 +6,7 @@
         v-model:active-index="baseActiveIndex">
       <SlideItem>
         <SlideRowList
+            style="height: calc(100% - 5rem);"
             v-model:active-index="activeIndex"
             :showIndicator="true"
             :useHomeLoading="true"
@@ -153,7 +154,6 @@
         @showShare="delayShowDialog( e => this.isSharing = true)"
         v-model="showFollowSetting"/>
 
-
     <FollowSetting2
         @cancelFollow="$refs.uploader.cancelFollow()"
         v-model="showFollowSetting2"/>
@@ -222,19 +222,738 @@ export default {
     return {
       webVideos: [
         {
-          "id": "d2f55373-80dd-4c14-93a7-7a40e9cbf049",
-          "posterUrl": "images/20210815/0.png",
-          "videoUrl": "http://qy9rc9xff.hn-bkt.clouddn.com/9.mp4",
-          "title": "",
-          "likeNum": null,
-          "commentNum": null,
-          "sharedNum": null,
-          "duration": null,
-          "musicId": "126f9654-450b-466c-8003-085199a7f9b9",
-          "browseCount": 0,
-          "createTime": "1629683008",
-          "createBy": "3e301843-e8bb-41c0-8240-9c4b42a17341",
-          "status": 1
+          "id": "034ae83b-ca0a-401a-b7c6-cf78361bae7b",
+          "cover": "https://p11.douyinpic.com/img/tos-cn-p-0015/48e513ae1df94a6cb0e23eabdacfdb64~c5_300x400.webp?from=4257465056_large",
+          "dynamic_cover": "https://p3.douyinpic.com/obj/tos-cn-p-0015/80e3288d63094603beaaf2f0e1568e19_1577426215?from=4257465056_large",
+          "origin_cover": "https://p3.douyinpic.com/tos-cn-p-0015/be6a2e67b69646778749e932c6d456b6_1577426215~tplv-dy-360p.webp?from=4257465056&s=&se=false&sh=&sc=&l=202108311459040102120742003404DFC4&biz_tag=feed_cover",
+          video:mp40,
+          "video_data_size": 26829508,
+          "duration": 427780,
+          "desc": "几人到深山探险，发现里面一只动物昆虫都没有，知道原因后都怕了 #看电影",
+          "allow_download": 0,
+          "allow_duet": 0,
+          "allow_react": 0,
+          "allow_music": 1,
+          "allow_douplus": 1,
+          "allow_share": 1,
+          "digg_count": 381,
+          "comment_count": 20,
+          "download_count": 6,
+          "play_count": 0,
+          "share_count": 2,
+          "forward_count": 0,
+          "collect_count": 3,
+          "sort": 195,
+          "is_top": 0,
+          "city": "",
+          "musicId": "2ee213c6-3e3f-4758-ba5a-7f1c955604a4",
+          "create_time": "1630423555",
+          "creator_id": "93864497380",
+          "status": 1,
+          "topics": [
+            {
+              "id": "85ceda30-898f-4b57-b891-0e58b3ab99a9",
+              "name": "看电影",
+              "creator_id": "93864497380",
+              "create_time": "1630423555",
+              "status": 1
+            }
+          ],
+          "music": {
+            "id": "cde50af2-628c-4d28-b9c6-67237a62518e",
+            "cover": "https://p29.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_100x100.jpeg?from=116350172",
+            "mp3": "https://sf3-cdn-tos.douyinstatic.com/obj/ies-music/1658584661080088.mp3",
+            "title": "@穷电影创作的原声",
+            "creator_id": "93864497380",
+            "create_time": "1630423555",
+            "status": 1
+          },
+          "author": {
+            "id": "93864497380",
+            "unique_id_modify_time": "1630393144",
+            "unique_id": "dyg141319",
+            "favoriting_count": 0,
+            "avatar": "https://p26.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_1080x1080.jpeg?from=116350172",
+            "city": "",
+            "province": null,
+            "country": "",
+            "location": "",
+            "birthday": "1990-01-01",
+            "cover": "https://p3.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
+            "following_count": 0,
+            "follower_count": 0,
+            "aweme_count": 0,
+            "nickname": "穷电影",
+            "phone": "",
+            "sex": "0",
+            "last_login_time": "1630423555",
+            "create_time": "1630423555",
+            "status": 1,
+            "desc": null,
+            "is_private": 0
+          }
+        },
+        {
+          "id": "0423ff88-ea37-40f6-ab88-0a90759b12ab",
+          "cover": "https://p3.douyinpic.com/img/tos-cn-p-0015/9208072278a34d01b3836cce1e0fca9a~c5_300x400.jpeg?from=4257465056_large",
+          "dynamic_cover": "https://p9.douyinpic.com/obj/tos-cn-p-0015/9208072278a34d01b3836cce1e0fca9a?from=4257465056_large",
+          "origin_cover": "https://p3.douyinpic.com/tos-cn-p-0015/9ecfae1dda2141d19f3e2396d18c4f52_1610439608~tplv-dy-360p.jpeg?from=4257465056&s=&se=false&sh=&sc=&l=202108311440160102120461454502506A&biz_tag=feed_cover",
+          video:mp41,
+          "video_data_size": 6038796,
+          "duration": 90927,
+          "desc": "几分钟看科幻片《寄生异种》 #我的观影报告  #抖音电影",
+          "allow_download": 1,
+          "allow_duet": 0,
+          "allow_react": 0,
+          "allow_music": 1,
+          "allow_douplus": 1,
+          "allow_share": 1,
+          "digg_count": 117,
+          "comment_count": 2,
+          "download_count": 0,
+          "play_count": 0,
+          "share_count": 2,
+          "forward_count": 1,
+          "collect_count": 0,
+          "sort": 48,
+          "is_top": 0,
+          "city": "350100",
+          "musicId": "f1e564f2-8461-48c1-824b-06bb4d3c5d82",
+          "create_time": "1630392647",
+          "creator_id": "54884802577",
+          "status": 1,
+          "topics": [
+            {
+              "id": "c10178eb-441f-4dc7-93b6-eaae1b6248cc",
+              "name": "我的观影报告",
+              "creator_id": "54884802577",
+              "create_time": "1630391758",
+              "status": 1
+            },
+            {
+              "id": "41821c6d-e14f-47f1-a391-f0b1f42afbe1",
+              "name": "抖音电影",
+              "creator_id": "54884802577",
+              "create_time": "1630391758",
+              "status": 1
+            }
+          ],
+          "music": {
+            "id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
+            "cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
+            "mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
+            "title": "@喵嗷污说电影创作的原声",
+            "creator_id": "54884802577",
+            "create_time": "1630391758",
+            "status": 1
+          },
+          "author": {
+            "id": "54884802577",
+            "unique_id_modify_time": "1630393144",
+            "unique_id": "mmaawu",
+            "favoriting_count": 0,
+            "avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
+            "city": "上海",
+            "province": "上海",
+            "country": "中国",
+            "location": "上海",
+            "birthday": "1988-01-01",
+            "cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
+            "following_count": 1111,
+            "follower_count": 2222,
+            "aweme_count": 3333,
+            "nickname": "喵嗷污说电影",
+            "phone": "",
+            "sex": "0",
+            "last_login_time": "1630423555",
+            "create_time": "1630423555",
+            "status": 1,
+            "desc": "108线网红，福州人在上海，没有更新就是在吃土",
+            "is_private": 0
+          }
+        },
+        {
+          "id": "05042932-a921-4c7b-9f88-618bb3100e51",
+          "cover": "https://p11.douyinpic.com/img/tos-cn-p-0015/3d6a0342b7f247ed999a13bd566b360e~c5_300x400.jpeg?from=4257465056_large",
+          "dynamic_cover": "https://p26.douyinpic.com/obj/tos-cn-p-0015/3d6a0342b7f247ed999a13bd566b360e?from=4257465056_large",
+          "origin_cover": "https://p5-ipv6.douyinpic.com/tos-cn-p-0015/48891e08b43e47e2a3af9f3945cf941f_1607739586~tplv-dy-360p.jpeg?from=4257465056&s=&se=false&sh=&sc=&l=202108311440220102120691615D029CD1&biz_tag=feed_cover",
+          video:mp42,
+          "video_data_size": 8996120,
+          "duration": 118703,
+          "desc": "美女失去记忆，被囚禁在密室内，没想到逃出去后才是她噩梦的开始 #我的观影报告",
+          "allow_download": 1,
+          "allow_duet": 0,
+          "allow_react": 0,
+          "allow_music": 1,
+          "allow_douplus": 1,
+          "allow_share": 1,
+          "digg_count": 4378,
+          "comment_count": 96,
+          "download_count": 25,
+          "play_count": 0,
+          "share_count": 34,
+          "forward_count": 1,
+          "collect_count": 22,
+          "sort": 64,
+          "is_top": 0,
+          "city": "350100",
+          "musicId": "a8c50095-998c-436c-883c-51b3b53fb504",
+          "create_time": "1630392882",
+          "creator_id": "54884802577",
+          "status": 1,
+          "topics": [
+            {
+              "id": "c10178eb-441f-4dc7-93b6-eaae1b6248cc",
+              "name": "我的观影报告",
+              "creator_id": "54884802577",
+              "create_time": "1630391758",
+              "status": 1
+            }
+          ],
+          "music": {
+            "id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
+            "cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
+            "mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
+            "title": "@喵嗷污说电影创作的原声",
+            "creator_id": "54884802577",
+            "create_time": "1630391758",
+            "status": 1
+          },
+          "author": {
+            "id": "54884802577",
+            "unique_id_modify_time": "1630393144",
+            "unique_id": "mmaawu",
+            "favoriting_count": 0,
+            "avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
+            "city": "上海",
+            "province": "上海",
+            "country": "中国",
+            "location": "上海",
+            "birthday": "1988-01-01",
+            "cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
+            "following_count": 1111,
+            "follower_count": 2222,
+            "aweme_count": 3333,
+            "nickname": "喵嗷污说电影",
+            "phone": "",
+            "sex": "0",
+            "last_login_time": "1630423555",
+            "create_time": "1630423555",
+            "status": 1,
+            "desc": "108线网红，福州人在上海，没有更新就是在吃土",
+            "is_private": 0
+          }
+        },
+        {
+          "id": "080a3b3d-0f76-4427-9ec9-661e1621cb1a",
+          "cover": "https://p11.douyinpic.com/img/tos-cn-p-0015/c3bbe172b24844eb8e576a1897e04435~c5_300x400.webp?from=4257465056_large",
+          "dynamic_cover": "https://p11.douyinpic.com/obj/tos-cn-p-0015/12fc583b6eaa49b4a0086664c8f54a5d?from=4257465056_large",
+          "origin_cover": "https://p26.douyinpic.com/tos-cn-p-0015/e7db9fba822c4d81b4ec4614f5c60cae~tplv-dy-360p.webp?from=4257465056&s=&se=false&sh=&sc=&l=202108311459170102040221632C04B06F&biz_tag=feed_cover",
+          video:mp43,
+          "video_data_size": 37824020,
+          "duration": 312474,
+          "desc": "夫妇二人来到一个诡异小镇，看到一个孩子的手，被吓到了 #看电影 ",
+          "allow_download": 0,
+          "allow_duet": 0,
+          "allow_react": 0,
+          "allow_music": 1,
+          "allow_douplus": 1,
+          "allow_share": 1,
+          "digg_count": 123907,
+          "comment_count": 2346,
+          "download_count": 431,
+          "play_count": 0,
+          "share_count": 267,
+          "forward_count": 22,
+          "collect_count": 1341,
+          "sort": 311,
+          "is_top": 0,
+          "city": "",
+          "musicId": "02792e4a-d4b3-4b30-8e1e-fa0bd0eabe1b",
+          "create_time": "1630423884",
+          "creator_id": "93864497380",
+          "status": 1,
+          "topics": [
+            {
+              "id": "85ceda30-898f-4b57-b891-0e58b3ab99a9",
+              "name": "看电影",
+              "creator_id": "93864497380",
+              "create_time": "1630423555",
+              "status": 1
+            }
+          ],
+          "music": {
+            "id": "cde50af2-628c-4d28-b9c6-67237a62518e",
+            "cover": "https://p29.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_100x100.jpeg?from=116350172",
+            "mp3": "https://sf3-cdn-tos.douyinstatic.com/obj/ies-music/1658584661080088.mp3",
+            "title": "@穷电影创作的原声",
+            "creator_id": "93864497380",
+            "create_time": "1630423555",
+            "status": 1
+          },
+          "author": {
+            "id": "93864497380",
+            "unique_id_modify_time": "1630393144",
+            "unique_id": "dyg141319",
+            "favoriting_count": 0,
+            "avatar": "https://p26.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_1080x1080.jpeg?from=116350172",
+            "city": "",
+            "province": null,
+            "country": "",
+            "location": "",
+            "birthday": "1990-01-01",
+            "cover": "https://p3.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
+            "following_count": 0,
+            "follower_count": 0,
+            "aweme_count": 0,
+            "nickname": "穷电影",
+            "phone": "",
+            "sex": "0",
+            "last_login_time": "1630423555",
+            "create_time": "1630423555",
+            "status": 1,
+            "desc": null,
+            "is_private": 0
+          }
+        },
+        {
+          "id": "08a90c93-807b-4a7a-aad3-68f75d65a9c8",
+          "cover": "https://p29.douyinpic.com/img/tos-cn-p-0015/1ce2018b919d49cfbdc380e9b7bc17ce~c5_300x400.jpeg?from=4257465056_large",
+          "dynamic_cover": "https://p11.douyinpic.com/obj/tos-cn-p-0015/1ce2018b919d49cfbdc380e9b7bc17ce?from=4257465056_large",
+          "origin_cover": "https://p5-ipv6.douyinpic.com/tos-cn-p-0015/697621dc8ff247aba499fdaedcf172fb_1606272887~tplv-dy-360p.jpeg?from=4257465056&s=&se=false&sh=&sc=&l=2021083114402801021219919632028316&biz_tag=feed_cover",
+          video:mp44,
+          "video_data_size": 12371092,
+          "duration": 139652,
+          "desc": "茂密森林中却没有一个动物或昆虫，专家进去研究，被吓得转身就跑 #我的观影报告",
+          "allow_download": 1,
+          "allow_duet": 0,
+          "allow_react": 0,
+          "allow_music": 1,
+          "allow_douplus": 1,
+          "allow_share": 1,
+          "digg_count": 245,
+          "comment_count": 10,
+          "download_count": 0,
+          "play_count": 0,
+          "share_count": 0,
+          "forward_count": 0,
+          "collect_count": 2,
+          "sort": 74,
+          "is_top": 0,
+          "city": "350100",
+          "musicId": "6e1325da-1af4-4d5e-8a33-3a4a69ff50a3",
+          "create_time": "1630392893",
+          "creator_id": "54884802577",
+          "status": 1,
+          "topics": [
+            {
+              "id": "c10178eb-441f-4dc7-93b6-eaae1b6248cc",
+              "name": "我的观影报告",
+              "creator_id": "54884802577",
+              "create_time": "1630391758",
+              "status": 1
+            }
+          ],
+          "music": {
+            "id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
+            "cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
+            "mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
+            "title": "@喵嗷污说电影创作的原声",
+            "creator_id": "54884802577",
+            "create_time": "1630391758",
+            "status": 1
+          },
+          "author": {
+            "id": "54884802577",
+            "unique_id_modify_time": "1630393144",
+            "unique_id": "mmaawu",
+            "favoriting_count": 0,
+            "avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
+            "city": "上海",
+            "province": "上海",
+            "country": "中国",
+            "location": "上海",
+            "birthday": "1988-01-01",
+            "cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
+            "following_count": 1111,
+            "follower_count": 2222,
+            "aweme_count": 3333,
+            "nickname": "喵嗷污说电影",
+            "phone": "",
+            "sex": "0",
+            "last_login_time": "1630423555",
+            "create_time": "1630423555",
+            "status": 1,
+            "desc": "108线网红，福州人在上海，没有更新就是在吃土",
+            "is_private": 0
+          }
+        },
+        {
+          "id": "09c9b531-4381-4542-b7bc-ca6e59389ee1",
+          "cover": "https://p3.douyinpic.com/img/tos-cn-p-0015/3099e1f9facb4f11a8d07221b39b9ffb_1575186937~c5_300x400.webp?from=4257465056_large",
+          "dynamic_cover": "https://p11.douyinpic.com/obj/tos-cn-p-0015/f80ce3457bf34f66be9254df9544f9d8_1575186867?from=4257465056_large",
+          "origin_cover": "https://p11.douyinpic.com/tos-cn-p-0015/af2ef1dd2e864379a7a475b1db005b62_1575186867~tplv-dy-360p.webp?from=4257465056&s=&se=false&sh=&sc=&l=202108311459070102112011425F04ED8F&biz_tag=feed_cover",
+          video:mp45,
+          "video_data_size": 16916839,
+          "duration": 384068,
+          "desc": "男子在沙漠无意中召唤出可怕怪物，怪物的能力让他很绝望 #看电影",
+          "allow_download": 0,
+          "allow_duet": 0,
+          "allow_react": 0,
+          "allow_music": 1,
+          "allow_douplus": 1,
+          "allow_share": 1,
+          "digg_count": 550,
+          "comment_count": 37,
+          "download_count": 3,
+          "play_count": 0,
+          "share_count": 3,
+          "forward_count": 0,
+          "collect_count": 5,
+          "sort": 208,
+          "is_top": 0,
+          "city": "",
+          "musicId": "b71c6566-10d9-4db0-b231-8b3e818bb191",
+          "create_time": "1630423585",
+          "creator_id": "93864497380",
+          "status": 1,
+          "topics": [
+            {
+              "id": "85ceda30-898f-4b57-b891-0e58b3ab99a9",
+              "name": "看电影",
+              "creator_id": "93864497380",
+              "create_time": "1630423555",
+              "status": 1
+            }
+          ],
+          "music": {
+            "id": "cde50af2-628c-4d28-b9c6-67237a62518e",
+            "cover": "https://p29.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_100x100.jpeg?from=116350172",
+            "mp3": "https://sf3-cdn-tos.douyinstatic.com/obj/ies-music/1658584661080088.mp3",
+            "title": "@穷电影创作的原声",
+            "creator_id": "93864497380",
+            "create_time": "1630423555",
+            "status": 1
+          },
+          "author": {
+            "id": "93864497380",
+            "unique_id_modify_time": "1630393144",
+            "unique_id": "dyg141319",
+            "favoriting_count": 0,
+            "avatar": "https://p26.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_1080x1080.jpeg?from=116350172",
+            "city": "",
+            "province": null,
+            "country": "",
+            "location": "",
+            "birthday": "1990-01-01",
+            "cover": "https://p3.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
+            "following_count": 0,
+            "follower_count": 0,
+            "aweme_count": 0,
+            "nickname": "穷电影",
+            "phone": "",
+            "sex": "0",
+            "last_login_time": "1630423555",
+            "create_time": "1630423555",
+            "status": 1,
+            "desc": null,
+            "is_private": 0
+          }
+        },
+        {
+          "id": "0aeeb9f4-5160-4d07-a468-a1fddd2a425c",
+          "cover": "https://p11.douyinpic.com/img/tos-cn-i-0004/b8d9811844d14f28a5d71b13ea30d89a~c5_300x400.jpeg?from=4257465056_large",
+          "dynamic_cover": "https://p29.douyinpic.com/obj/tos-cn-i-0004/b8d9811844d14f28a5d71b13ea30d89a?from=4257465056_large",
+          "origin_cover": "https://p11.douyinpic.com/tos-cn-p-0015/ac6b1eb1b6994ee1a284401f422f4d93_1627866958~tplv-dy-360p.jpeg?from=4257465056&s=&se=false&sh=&sc=&l=202108301444360102111780824E10113C&biz_tag=feed_cover",
+          video:mp46,
+          "video_data_size": 26944285,
+          "duration": 276000,
+          "desc": "2100年人口锐减，文明疯狂倒退，现今科技成了神话般的存在  #抖音电影#我的观影报告 ",
+          "allow_download": 0,
+          "allow_duet": 0,
+          "allow_react": 0,
+          "allow_music": 1,
+          "allow_douplus": 1,
+          "allow_share": 1,
+          "digg_count": 47,
+          "comment_count": 1,
+          "download_count": 0,
+          "play_count": 0,
+          "share_count": 1,
+          "forward_count": 0,
+          "collect_count": 1,
+          "sort": 8,
+          "is_top": 0,
+          "city": "350100",
+          "musicId": "9db983b3-b68c-465b-85f5-030f5646e01f",
+          "create_time": "1630391758",
+          "creator_id": "54884802577",
+          "status": 1,
+          "topics": [
+            {
+              "id": "d15b72d0-5b8c-489b-a921-0fc236eec705",
+              "name": "抖音电影#我的观影报告",
+              "creator_id": "54884802577",
+              "create_time": "1630391758",
+              "status": 1
+            }
+          ],
+          "music": {
+            "id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
+            "cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
+            "mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
+            "title": "@喵嗷污说电影创作的原声",
+            "creator_id": "54884802577",
+            "create_time": "1630391758",
+            "status": 1
+          },
+          "author": {
+            "id": "54884802577",
+            "unique_id_modify_time": "1630393144",
+            "unique_id": "mmaawu",
+            "favoriting_count": 0,
+            "avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
+            "city": "上海",
+            "province": "上海",
+            "country": "中国",
+            "location": "上海",
+            "birthday": "1988-01-01",
+            "cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
+            "following_count": 1111,
+            "follower_count": 2222,
+            "aweme_count": 3333,
+            "nickname": "喵嗷污说电影",
+            "phone": "",
+            "sex": "0",
+            "last_login_time": "1630423555",
+            "create_time": "1630423555",
+            "status": 1,
+            "desc": "108线网红，福州人在上海，没有更新就是在吃土",
+            "is_private": 0
+          }
+        },
+        {
+          "id": "0b1fb9c4-9d5c-40f7-9a01-1310674cbfeb",
+          "cover": "https://p3.douyinpic.com/img/tos-cn-p-0015/bffc96dac41548d99a23e555d2bd3d62~c5_300x400.jpeg?from=4257465056_large",
+          "dynamic_cover": "https://p11.douyinpic.com/obj/tos-cn-p-0015/bffc96dac41548d99a23e555d2bd3d62?from=4257465056_large",
+          "origin_cover": "https://p1.douyinpic.com/tos-cn-p-0015/813c7bded67f4e3da0972f85be32eb3f_1608893061~tplv-dy-360p.jpeg?from=4257465056&s=&se=false&sh=&sc=&l=202108311440220102120691615D029CD1&biz_tag=feed_cover",
+          video:mp47,
+          "video_data_size": 9321536,
+          "duration": 129583,
+          "desc": "几分钟看科幻片《登月先锋》 #我的观影报告  #抖音电影",
+          "allow_download": 1,
+          "allow_duet": 0,
+          "allow_react": 0,
+          "allow_music": 1,
+          "allow_douplus": 1,
+          "allow_share": 1,
+          "digg_count": 175,
+          "comment_count": 4,
+          "download_count": 0,
+          "play_count": 0,
+          "share_count": 2,
+          "forward_count": 0,
+          "collect_count": 2,
+          "sort": 57,
+          "is_top": 0,
+          "city": "350100",
+          "musicId": "e1c8d672-1831-47b4-87c4-da7e5c4250b9",
+          "create_time": "1630392882",
+          "creator_id": "54884802577",
+          "status": 1,
+          "topics": [
+            {
+              "id": "c10178eb-441f-4dc7-93b6-eaae1b6248cc",
+              "name": "我的观影报告",
+              "creator_id": "54884802577",
+              "create_time": "1630391758",
+              "status": 1
+            },
+            {
+              "id": "41821c6d-e14f-47f1-a391-f0b1f42afbe1",
+              "name": "抖音电影",
+              "creator_id": "54884802577",
+              "create_time": "1630391758",
+              "status": 1
+            }
+          ],
+          "music": {
+            "id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
+            "cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
+            "mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
+            "title": "@喵嗷污说电影创作的原声",
+            "creator_id": "54884802577",
+            "create_time": "1630391758",
+            "status": 1
+          },
+          "author": {
+            "id": "54884802577",
+            "unique_id_modify_time": "1630393144",
+            "unique_id": "mmaawu",
+            "favoriting_count": 0,
+            "avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
+            "city": "上海",
+            "province": "上海",
+            "country": "中国",
+            "location": "上海",
+            "birthday": "1988-01-01",
+            "cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
+            "following_count": 1111,
+            "follower_count": 2222,
+            "aweme_count": 3333,
+            "nickname": "喵嗷污说电影",
+            "phone": "",
+            "sex": "0",
+            "last_login_time": "1630423555",
+            "create_time": "1630423555",
+            "status": 1,
+            "desc": "108线网红，福州人在上海，没有更新就是在吃土",
+            "is_private": 0
+          }
+        },
+        {
+          "id": "0ba38940-a395-474a-a7f6-b45c123f9c4d",
+          "cover": "https://p9.douyinpic.com/img/tos-cn-p-0015/9f47c686c9224036b82f5c7b147e6119~c5_300x400.webp?from=4257465056_large",
+          "dynamic_cover": "https://p26.douyinpic.com/obj/tos-cn-p-0015/fde5131f00e54106877d06f775cd21ca_1572239688?from=4257465056_large",
+          "origin_cover": "https://p11.douyinpic.com/tos-cn-p-0015/8a757ad4df69407f8d0d443eaa0b60a2_1572239690~tplv-dy-360p.webp?from=4257465056&s=&se=false&sh=&sc=&l=202108311459110102112011425F04EF3F&biz_tag=feed_cover",
+          video:mp48,
+          "video_data_size": 25251313,
+          "duration": 449263,
+          "desc": "",
+          "allow_download": 0,
+          "allow_duet": 0,
+          "allow_react": 0,
+          "allow_music": 1,
+          "allow_douplus": 1,
+          "allow_share": 1,
+          "digg_count": 192,
+          "comment_count": 17,
+          "download_count": 1,
+          "play_count": 0,
+          "share_count": 1,
+          "forward_count": 0,
+          "collect_count": 2,
+          "sort": 257,
+          "is_top": 0,
+          "city": "",
+          "musicId": "c2a75580-1c5e-47b2-b13e-63362a95aea7",
+          "create_time": "1630423745",
+          "creator_id": "93864497380",
+          "status": 1,
+          "topics": [
+            {
+              "id": "f4209ab6-5117-4401-8070-919fd8ac2cd5",
+              "name": "电影",
+              "creator_id": "93864497380",
+              "create_time": "1630423745",
+              "status": 1
+            }
+          ],
+          "music": {
+            "id": "cde50af2-628c-4d28-b9c6-67237a62518e",
+            "cover": "https://p29.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_100x100.jpeg?from=116350172",
+            "mp3": "https://sf3-cdn-tos.douyinstatic.com/obj/ies-music/1658584661080088.mp3",
+            "title": "@穷电影创作的原声",
+            "creator_id": "93864497380",
+            "create_time": "1630423555",
+            "status": 1
+          },
+          "author": {
+            "id": "93864497380",
+            "unique_id_modify_time": "1630393144",
+            "unique_id": "dyg141319",
+            "favoriting_count": 0,
+            "avatar": "https://p26.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_1080x1080.jpeg?from=116350172",
+            "city": "",
+            "province": null,
+            "country": "",
+            "location": "",
+            "birthday": "1990-01-01",
+            "cover": "https://p3.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
+            "following_count": 0,
+            "follower_count": 0,
+            "aweme_count": 0,
+            "nickname": "穷电影",
+            "phone": "",
+            "sex": "0",
+            "last_login_time": "1630423555",
+            "create_time": "1630423555",
+            "status": 1,
+            "desc": null,
+            "is_private": 0
+          }
+        },
+        {
+          "id": "0be47c89-f6e8-4d5d-820a-072e75c52fbf",
+          "cover": "https://p5-ipv6.douyinpic.com/img/tos-cn-p-0015/1941731e18714268a52855ce869e3092_1572771120~c5_300x400.webp?from=4257465056_large",
+          "dynamic_cover": "https://p11.douyinpic.com/obj/tos-cn-p-0015/55b40ca5368a49eca282fb868c8fb98b_1572771083?from=4257465056_large",
+          "origin_cover": "https://p5-ipv6.douyinpic.com/tos-cn-p-0015/cd59468a8d0149aeb5291966004ae4e0_1572771088~tplv-dy-360p.webp?from=4257465056&s=&se=false&sh=&sc=&l=202108311459110102112011425F04EF3F&biz_tag=feed_cover",
+          video:mp49,
+          "video_data_size": 17839401,
+          "duration": 262127,
+          "desc": "灰姑娘被前男友羞辱，霸道总裁看不下去充当男友，瞬间让渣男无地自容#西瓜放映厅",
+          "allow_download": 1,
+          "allow_duet": 0,
+          "allow_react": 0,
+          "allow_music": 1,
+          "allow_douplus": 1,
+          "allow_share": 1,
+          "digg_count": 116899,
+          "comment_count": 2204,
+          "download_count": 704,
+          "play_count": 0,
+          "share_count": 946,
+          "forward_count": 36,
+          "collect_count": 856,
+          "sort": 252,
+          "is_top": 0,
+          "city": "",
+          "musicId": "11e5f2b6-3ecc-4f6c-ae95-609313b9e22a",
+          "create_time": "1630423745",
+          "creator_id": "54884802577",
+          "status": 1,
+          "topics": [
+            {
+              "id": "6e2d8f8b-a7f3-43ca-861c-882abd9eeaf6",
+              "name": "西瓜放映厅",
+              "creator_id": "93864497380",
+              "create_time": "1630423585",
+              "status": 1
+            }
+          ],
+          "music": {
+            "id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
+            "cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
+            "mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
+            "title": "@喵嗷污说电影创作的原声",
+            "creator_id": "54884802577",
+            "create_time": "1630391758",
+            "status": 1
+          },
+          "author": {
+            "id": "54884802577",
+            "unique_id_modify_time": "1630393144",
+            "unique_id": "mmaawu",
+            "favoriting_count": 0,
+            "avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
+            "city": "上海",
+            "province": "上海",
+            "country": "中国",
+            "location": "上海",
+            "birthday": "1988-01-01",
+            "cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
+            "following_count": 1111,
+            "follower_count": 2222,
+            "aweme_count": 3333,
+            "nickname": "喵嗷污说电影",
+            "phone": "",
+            "sex": "0",
+            "last_login_time": "1630423555",
+            "create_time": "1630423555",
+            "status": 1,
+            "desc": "108线网红，福州人在上海，没有更新就是在吃土",
+            "is_private": 0
+          }
         }
       ],
       videos: [
@@ -290,7 +1009,7 @@ export default {
         {
           "id": "21c4d0e6-4895-44cf-abae-1ad6d4e51cfe",
           "posterUrl": "images/20210815/11.png",
-          "videoUrl": c,
+          "videoUrl": mp42,
           "title": "",
           "likeNum": "4312856",
           "commentNum": "14431",
@@ -511,9 +1230,10 @@ export default {
       this.$notice('操作成功，将减少此类视频的推荐')
     },
     async getData() {
-      if (process.env.NODE_ENV !== 'development') {
+      if (process.env.NODE_ENV === 'development') {
         this.totalSize = 11
-        return this.videos = this.$clone(this.localVideos)
+        // return this.videos = this.$clone(this.localVideos)
+        return this.videos = this.$clone(this.webVideos)
       }
       this.loading = true
       let res = await this.$api.videos.recommended({pageNo: this.pageNo, pageSize: this.pageSize})
diff --git a/src/router/index.js b/src/router/index.js
index 9f0c718..cc2899e 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -48,6 +48,7 @@ import JoinedGroupChat from "../pages/message/JoinedGroupChat";
 import Report from "../pages/home/Report";
 import SubmitReport from "../pages/home/SubmitReport";
 import RequestUpdate from "../pages/me/RequestUpdate";
+import Test4 from "../pages/Test4";
 
 const routes = [
   // {path: '', component: Music},
@@ -56,6 +57,7 @@ const routes = [
   {path: '/test', component: Test},
   {path: '/test2', component: Test2},
   {path: '/test3', component: Test3},
+  {path: '/test4', component: Test4},
   {path: '/home', component: Index},
   {path: '/home/report', component: Report},
   {path: '/home/submit-report', component: SubmitReport},