reader/pages/message/index.wxml

<navigationBar></navigationBar>
<view class="messagePage">
  <view class="searchBox">
    <input class="input" maxlength="20" placeholder="查找昵称/学号/手机号" />
    <image src="/static/search-2.png" class="magnifier" />
  </view>
  <view class="messageList">
    <view class="base authority">
      <image src="/static/message3.png" class="avatar" />
      <view class="body">
        <view class="name">评论</view>
        <view class="avatars">
          <image src="/static/tj2.png" class="miniAvatar" wx:for="{{6}}" wx:key="index" />
        </view>
      </view>
      <view class="right">
        <view class="date">2023-3-14</view>
        <view class="unread">10</view>
      </view>
    </view>
    <view class="base authority">
      <image src="/static/zan.png" class="avatar" />
      <view class="body">
        <view class="name">赞</view>
        <view class="avatars">
          <image src="/static/tj2.png" class="miniAvatar" wx:for="{{6}}" wx:key="index" />
        </view>
      </view>
      <view class="right">
        <view class="date">2023-3-14</view>
        <view class="unread">10</view>
      </view>
    </view>
    <view class="base authority">
      <image src="/static/notice.png" class="avatar" />
      <view class="body">
        <view class="name">通知</view>
      </view>
      <view class="right">
        <view class="date">2023-3-14</view>
        <view class="unread">10</view>
      </view>
    </view>
    <view class="base user" wx:for="{{16}}" wx:key="index" bind:longpress="onLongPress" hover-class='pressHover'>
      <image src="/static/message3.png" class="avatar" />
      <view class="body">
        <view class="name textOver">帅气小男孩</view>
        <view class="info textOver">
          朗读的太棒了！向你学习向你学习俄文企鹅企鹅企鹅企鹅
        </view>
      </view>
      <view class="right">
        <view class="date">2023-3-14</view>
        <view class="unread">10</view>
      </view>
    </view>
  </view>
  <view class="menuBg" bind:touchstart="cancelMenu" wx:if="{{menu.show}}"></view>
  <view class="menu" wx:if="{{menu.show}}" style="top:{{menu.top}}px;left:{{menu.left}}px">
    <view class="menu-one">
      <image src="/static/istop.png" class="icon" /> 置顶该聊天
    </view>
    <view>
      <image src="/static/del.png" class="icon" />
      删除该聊天
    </view>
  </view>
</view>