applet/template/view/index.wxml

<custom style="height:{{config.bar.custom}}px;">
  <bar class="fixed gradual-pink" style="height:{{config.bar.custom}}px;padding-top:{{config.bar.status}}px;">
    <navigator class='action' open-type="navigateBack" delta="1" hover-class="none">
      <icon class='icon-back' /> 卡片
    </navigator>
    <view class='action'>
      <load class="load-icon {{loading ? 'loading':'over'}}"></load>
    </view>
  </bar>
</custom>

<bar class="solid-bottom">
  <view class='action'>
    <icon class='icon-titles text-orange ' /> 最新
  </view>
  <view class='action'>
    <switch class='sm' checked='{{isCard}}' bindchange='isCard'></switch>
  </view>
</bar>
<card class="dynamic">
  <item wx:for="1" wx:key class="shadow">
    <list class="menu menu-avatar">
      <item>
        <avatar class="round lg" style="background-image:url(https://image.weilanwl.com/img/square-1.jpg);"></avatar>
        <view class='content flex-sub'>
          <view>晓晓萌</view>
          <view class='text-gray text-sm flex justify-between'>
            2018年12月3日
          </view>
        </view>
      </item>
    </list>
    <view class='text-content'>
      你们的铲屎官是不是经常突然对手机傻笑？我家铲屎官常常坐沙发上笑的发抖！（暗中观察.jpg）
    </view>
    <view class="grid col-1}} flex-sub padding-lr">
      <view class="bg-img only-img" style="background-image:url(https://image.weilanwl.com/img/square-1.jpg);" wx:for="1" wx:key>
      </view>
    </view>
    <view class='text-gray text-sm text-right padding'>
      <icon class="icon-attentionfill" /> 10
      <icon class="icon-appreciatefill" /> 20
      <icon class="icon-messagefill" /> 30
    </view>
    <list class="menu menu-avatar comment solids-top">
      <item wx:for="{{2}}" wx:key>
        <avatar class="round" style="background-image:url(https://image.weilanwl.com/img/square-1.jpg);"></avatar>
        <view class='content'>
          <view class='text-grey'>猪皮蛋</view>
          <view class='text-gray text-content text-df'>
            我家铲屎官不舔毛，还抠脚！
          </view>
          <view class='bg-grey padding-sm radius margin-top-sm  text-sm' wx:if="{{index==1}}">
            <view class="flex {{index!=0?'margin-top-sm':'' }}" wx:for="{{2}}" wx:key>
              <view>我：</view>
              <view class='flex-sub'>我家的铲屎官也不舔毛！</view>
            </view>
          </view>
          <view class='margin-top-sm flex justify-between'>
            <view class='text-gray text-df'>2018年12月4日</view>
            <view>
              <icon class="icon-appreciate{{!isZan?'fill':''}} text-{{!isZan?'red':'gray'}}" />
              <icon class="icon-messagefill text-gray margin-left-sm" />
            </view>
          </view>
        </view>
      </item>
    </list>
  </item>
</card>