替换banner

app.json

@@ -1,7 +1,7 @@
 {
   "pages": [
-    "pages/works/index",
     "pages/index/index",
+    "pages/works/index",
     "pages/collection/index",
     "pages/personal/index",
     "pages/childClassify/index",

components/banner/index.js

@@ -3,14 +3,17 @@ import {
 } from '~/api/global'
 Component({
   properties: {
-
+    classify: {
+      type: Number,
+      value: 1
+    }
   },
   data: {
     bannerList: []
   },
   lifetimes: {
     attached() {
-      console.log('111');
+      this.getBannerList()
     },
   },
   /**
@@ -18,12 +21,22 @@ Component({
    */
   methods: {
     async getBannerList() {
-      let bannerList = await getBannerList(1)
-      console.log(bannerList);
+      let bannerList = await getBannerList(this.properties.classify)
       this.setData({
         bannerList
       })
     },
-    bannelEvent() {},
+    bannelEvent({
+      currentTarget
+    }) {
+      //1：图片，2：邀新榜，3：热播榜，4：挑战pk榜，5，朗读赛，6，领取勋章
+      switch (currentTarget.dataset.type) {
+        case 1:
+          break;
+        case 2:
+          break;
+        default:
+      }
+    },
   }
 })

components/banner/index.wxml

@@ -2,7 +2,7 @@
   <view class="headerBg"></view>
   <swiper class="swiper" autoplay circular indicator-dots indicator-active-color="#fff" indicator-color='#ecececa1'>
     <block wx:for="{{bannerList}}" wx:key="id">
-      <swiper-item bindtap='bannelEvent'>
+      <swiper-item bindtap='bannelEvent' data-type='{{item.type}}'>
         <image src="{{item.icon}}" class="swiper-item" mode="" />
       </swiper-item>
     </block>

pages/index/index.json

@@ -2,6 +2,7 @@
   "usingComponents": {
     "rewardedVideo": "/components/rewardedVideo/index",
     "navigationBar": "/components/navigationBar/index",
+    "banner": "/components/banner/index",
     "worksList": "/components/worksList/index"
   },
   "navigationStyle": "custom",

pages/index/index.less

@@ -1,32 +1,4 @@
 .recommend {
-  .header {
-    position: relative;
-
-    .headerBg {
-      position: absolute;
-      z-index: -2;
-      width: 100%;
-      height: 100%;
-      background-color: white;
-    }
-
-    .swiper {
-      margin: 0 auto;
-      width: 710rpx;
-      height: 216rpx;
-      border-radius: 20rpx;
-      overflow: hidden;
-      box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
-
-      .swiper-item {
-        width: 100%;
-        height: 100%;
-        border-radius: 20rpx;
-        overflow: hidden;
-      }
-
-    }
-  }
 
   .scrollBox {
     width: 100%;
@@ -58,19 +30,6 @@
     }
   }
 
-  .demo-text-1 {
-    background-color: rebeccapurple
-  }
-
-  .demo-text-2 {
-    background-color: rgb(100, 153, 51)
-  }
-
-  .demo-text-3 {
-    background-color: rgb(228, 119, 46)
-  }
-
-
   .selectType {
     padding: 30rpx 15rpx 30rpx 26rpx;
     display: flex;

pages/index/index.wxml

@@ -1,16 +1,6 @@
 <navigationBar bind:reload='resetData'></navigationBar>
 <view class="recommend">
-  <!-- 轮播图 -->
-  <view class="header">
-    <view class="headerBg"></view>
-    <swiper class="swiper" autoplay circular indicator-dots indicator-active-color="#fff" indicator-color='#ecececa1'>
-      <block wx:for="{{background}}" wx:key="*this">
-        <swiper-item>
-          <view class="swiper-item {{item}}"></view>
-        </swiper-item>
-      </block>
-    </swiper>
-  </view>
+  <banner classify='1' />
   <!-- 滚动定位 -->
   <view class="scrollBox {{isFixed?'isFixed':''}}" style="top:{{navBarHeight}}px;">
     <!-- 一级分类区域 -->

pages/index/index.wxss

@@ -1,27 +1,3 @@
-.recommend .header {
-  position: relative;
-}
-.recommend .header .headerBg {
-  position: absolute;
-  z-index: -2;
-  width: 100%;
-  height: 100%;
-  background-color: white;
-}
-.recommend .header .swiper {
-  margin: 0 auto;
-  width: 710rpx;
-  height: 216rpx;
-  border-radius: 20rpx;
-  overflow: hidden;
-  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
-}
-.recommend .header .swiper .swiper-item {
-  width: 100%;
-  height: 100%;
-  border-radius: 20rpx;
-  overflow: hidden;
-}
 .recommend .scrollBox {
   width: 100%;
 }
@@ -46,15 +22,6 @@
   font-weight: bold;
   font-size: 24rpx;
 }
-.recommend .demo-text-1 {
-  background-color: rebeccapurple;
-}
-.recommend .demo-text-2 {
-  background-color: #649933;
-}
-.recommend .demo-text-3 {
-  background-color: #e4772e;
-}
 .recommend .selectType {
   padding: 30rpx 15rpx 30rpx 26rpx;
   display: flex;

pages/works/index.wxml

@@ -1,5 +1,5 @@
 <navigationBar bind:reload='resetData'></navigationBar>
 <view class="worksBox">
   <!-- 轮播图 -->
-  <banner />
+  <banner classify='1' />
 </view>