索引列表

• 样式图例

• 示例代码

<view class="cu-bar bg-white search fixed" style="top:{{CustomBar}}px;">
  <view class="search-form round">
    <text class="cuIcon-search"></text>
    <input type="text" placeholder="输入搜索的关键词" confirm-type="search"></input>
  </view>
  <view class="action">
    <button class="cu-btn bg-gradual-green shadow-blur round">搜索</button>
  </view>
</view>
<scroll-view scroll-y class="indexes" scroll-into-view="indexes-{{listCurID}}" style="height:calc(100vh - {{CustomBar}}px - 50px)" scroll-with-animation="true" enable-back-to-top="true">
  <block wx:for="{{list}}" wx:key>
    <view class="padding indexItem-{{list[index]}}" id="indexes-{{list[index]}}" data-index="{{list[index]}}">{{list[index]}}</view>
    <view class="cu-list menu-avatar no-padding">
      <view class="cu-item" wx:for="{{2}}" wx:key wx:for-index="sub">
        <view class="cu-avatar round lg">{{list[index]}}</view>
        <view class="content">
          <view class="text-grey">{{list[index]}}
            <text class="text-abc">{{list[sub]}}</text>君</view>
          <view class="text-gray text-sm">
            有{{sub+2}}个主子需要伺候
          </view>
        </view>
      </view>
    </view>
  </block>
</scroll-view>
<view class="indexBar" style="height:calc(100vh - {{CustomBar}}px - 50px)">
  <view class="indexBar-box" bindtouchstart="tStart" bindtouchend="tEnd" catchtouchmove="tMove">
    <view class="indexBar-item" wx:for="{{list}}" wx:key id="{{index}}" bindtouchstart="getCur" bindtouchend="setCur">{{list[index]}}</view>
  </view>
</view>