#微信小程序#参照微信朋友圈实现内容回复、弹起输入框在软键盘之上

实现的是一个展示用户历史打卡数据,其中部分打卡有工作人员点评,而用户可以回复工作人员的点评(仅能回复一条)。
界面效果如下图所示:
图1
图2

简单记录整理一下这个界面的代码。
纠结很久的点在于如何做到像微信朋友圈那样,点击评论按键,弹出输入框和软键盘,并且输入框的位置刚好对准需要评论的内容底下。
我目前只实现了前半部分,输入框的位置还不能很好地对准内容组件的底部,并且使用感并不好,弹出收回输入框和软键盘的过程卡卡的。
后续还要不断优化。


<!-- wxml -->
<block wx:if="{
    {items.length==0}}">
    <view style="margin-top:40rpx; text-align:center;">暂无历史!</view>
  </block>
  <block wx:for="{
    {items}}" wx:for-item="item" wx:for-index="index2" wx:key="id">
    <view class="record">
      <view class="record-item-history">
        <view class='history-left'>
          <view class='history-left-type'>{
  {type[index2]}}</view>
          <view class='history-left-date'>{
  {date[index2][0]}}</view>
        </view>
        <view class="history-right">
          <image src='{
    {img[index2]}}' mode="aspectFill"></image>
          <view class="history-right-memo">{
  {memo[index2]}}</view>
          <view class="history-right-pyq">
            <view wx:if="{
    {feedbacks[index2]==-1}}" style="color: rgb(95, 111, 144);">等待反馈</view>
            <view wx:else class="history-right-pyq-doctor"  bindtap="showReply" data-cid
  • 0
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值