reader/pages/index/index.wxml

<navigationBar></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>
    <!-- 一级分类区域 -->
    <scroll-view class="firstClassify" scroll-x="true">
        <view class="firstBox" wx:for="{{10}}" wx:key="index">
            <image class="icon" src="/static/header.png" mode="" />
            <view class="name">书香美文</view>
        </view>
    </scroll-view>
    <!-- 搜索框 -->
    <view class="search">
        <image src="/static/search.png" class="searchImg" />
        <view class="input" />
    </view>
    <!-- 展示类型选择 -->
    <view class="selectType" bindtap="selectType">
        <view class="type {{currentType=='1'?'currentType':''}}" data-type='1'>优秀作品展播</view>
        <view class="type {{currentType=='2'?'currentType':''}}" data-type='2'>官方推荐</view>
        <view class="type {{currentType=='3'?'currentType':''}}" data-type='3'>官方活动</view>
    </view>
    <!-- 优秀作品展播及官方推荐列表组件 -->
    <worksList id="worksList" worksList="{{list}}" />
</view>