fix

1. 修复初始化的tab阴影， 阴影淡化

components/modules/menuBox/tab.vue

@@ -13,7 +13,7 @@
         </li>
       </ul>
     </div>
-    <div class="follow" v-if="wechatInfo.status" @click="_showFollow">
+    <div class="follow" v-if="wechatInfo.status" @click="_showFollow" ref="follow">
       <span class="icon"></span>
       <span>关注</span>
     </div>
@@ -67,7 +67,10 @@ export default {
       if (res.code === 200 && res.errorCode === 0) {
         this.wechatInfo = res.data || {};
         this.isScroll()
-        this.boxScrollListener()
+        this.$nextTick(() => {
+          this.listScroll()
+          this.boxScrollListener()
+        })
       }
     },
     _tabSwitch(num) {
@@ -89,7 +92,6 @@ export default {
     },
     // dom
     isScroll() {
-      this.$nextTick(() => {
         const boxScroll = this.$refs.boxScroll
         const fatherWidth = boxScroll.clientWidth
         const childWidth = boxScroll.getElementsByClassName('list')[0].clientWidth
@@ -98,12 +100,13 @@ export default {
               item.style['max-width'] = 'none'
           }
         }
-      })
     },
     boxScrollListener() {
-      const boxScroll = this.$refs.boxScroll
-      if (!boxScroll) return
-      boxScroll.addEventListener('scroll', this.listScroll)
+      this.$nextTick(() => {
+        const boxScroll = this.$refs.boxScroll
+        if (!boxScroll) return
+        boxScroll.addEventListener('scroll', this.listScroll)
+      })
     },
     listScroll() {
       const boxScroll = this.$refs.boxScroll
@@ -112,15 +115,15 @@ export default {
       if (fatherWidth >= childWidth) return
       const max = childWidth - fatherWidth
       const scrollLeft = boxScroll.scrollLeft
-      console.log(scrollLeft, max)
+      console.log(max, scrollLeft)
       if (scrollLeft > 0 && scrollLeft < max) {
-        boxScroll.style.background = 'radial-gradient(at left, rgba(0,0,0,.5), transparent 70%) left/ 15px 200%, radial-gradient(at right, rgba(0,0,0,.5), transparent 70%) right / 15px 200%'
+        boxScroll.style.background = 'radial-gradient(at left, rgba(0,0,0,.3), transparent 70%) left/ 15px 200%, radial-gradient(at right, rgba(0,0,0,.3), transparent 70%) right / 15px 200%'
         boxScroll.style['background-repeat'] = 'no-repeat'
       } else if (scrollLeft <= 0) {
-        boxScroll.style.background = 'radial-gradient(at right, rgba(0,0,0,.5), transparent 70%) right / 15px 200%'
+        boxScroll.style.background = 'radial-gradient(at right, rgba(0,0,0,.3), transparent 70%) right / 15px 200%'
         boxScroll.style['background-repeat'] = 'no-repeat'
       } else if (scrollLeft >= max) {
-         boxScroll.style.background = 'radial-gradient(at left, rgba(0,0,0,.5), transparent 70%) left/ 15px 200%'
+         boxScroll.style.background = 'radial-gradient(at left, rgba(0,0,0,.3), transparent 70%) left/ 15px 200%'
         boxScroll.style['background-repeat'] = 'no-repeat'
       }
     }
@@ -128,7 +131,7 @@ export default {
   watch: {
     active(){
       this.switchMid()
-    }
+    },
   }
 };
 </script>