收藏
回答

scroll-view开启了refresher之后,为什么真机演示子元素的弹窗会出现异常?

页面的wxml

<navigation-bar title="我的用户" color="black" background="#FFF"></navigation-bar>
<view style="position: fixed; width: 100%;height: 100rpx;background-color: white;z-index: 99;">
  <van-search
    value="{{inputSearchKey}}"
    shape="round"
    placeholder="输入手机号或姓名搜索"
    use-action-slot
    bind:change="onChange"
    bind:clear="onSearch"
    bind:search="onSearch"
  >
    <view style="width:80rpx; height:100%; margin-right: 26rpx;margin-left: 16rpx;text-align: center;" slot="action" bind:tap="onSearch">搜索</view>
  </van-search>
</view>

<scroll-view 
  class="container-scroll"
  refresher-enabled="{{true}}"
  refresher-threshold="{{10}}"
  refresher-default-style="black"
  refresher-background="#F7F7F7"
  refresher-triggered="{{triggered}}"
  bindrefresherrefresh="onRefresh"  
  bindscrolltolower="loadMore"
>
  <block wx:for="{{dataList}}" wx:key="id">
    <my-user-cell userModel="{{item}}"></my-user-cell>
  </block>
</scroll-view>
<van-toast id="van-toast" />



my-user-cell组件代码如下

<root-portal>
  <van-dialog
    use-slot
    title="{{memoDialogTitle}}"
    show="{{ memoDialogVisible }}"
    show-cancel-button
    bind:close="dialogClosed"
    bind:cancel="dialogClosed"
    bind:confirm="setUserMemo"
    confirm-button-color="#6079F1"
  >
    <view style="display: flex; justify-content: center; align-items: center;padding-top: 40rpx; padding-bottom: 50rpx;">
      <view style="width: 80%;height: 160rpx;background: #F5F5F5;border-radius: 10rpx;opacity: 0.6;padding: 16rpx;">
        <textarea style="height: 100%; width: 100%;" value="{{userMemoStr}}" bindinput="userMemoInputListener" confirm-type="done" />
      </view>
    </view>
  </van-dialog>
</root-portal>

<view class="cell-container">
  <view class="card-container">
    <view class="card-header">
      <view style="height: 100%; width: 136rpx;display: flex;justify-content: center;align-items: center;">
        <image src="../../../images/rider_avatar.png" style="height:80rpx;width:80rpx;"/>
      </view>
      <view style="height: 100%;width: 80%;display: flex;flex-direction: column;justify-content: center;">
        <view style="display: flex;width: 100%;flex-direction: row;justify-content: space-between; align-items: center;">
          <text style="font-size: 34rpx;color: #333333;font-weight: bloder;">{{userModel.realName + ' ' + userModel.phoneNum}}</text>
          <van-tag wx:if="{{userModel.status == 1}}" size="large" style="margin-right: 20rpx;" color="#F4F8FF" text-color="#3171EF">使用中</van-tag>
          <van-tag wx:elif="{{userModel.status == 2}}" size="large" style="margin-right: 20rpx;" color="#EEFFFB" text-color="#56C386">未开始</van-tag>
          <van-tag wx:elif="{{userModel.status == 3}}"  size="large" style="margin-right: 20rpx;" color="#FFF6F6" text-color="#FF6565">已结束</van-tag>
          <van-tag wx:else size="large" style="margin-right: 20rpx;" color="#F8F8F8" text-color="#777777">未知</van-tag>
        </view>
        <text class="memo-text">备注:{{userMemoStr}}</text>
      </view>
    </view>
    <view class="card-center">
      <view class="center-days">
        <view>
          <text style="font-size: 28rpx;color: #333333;">剩余天数:</text>
          <text style="font-size: 28rpx;color: #333333;">{{userModel.remainDays ? userModel.remainDays : 0}}</text>
        </view>
        <view style="width: 2rpx;height: 44rpx;background-color: #EEEEEE;"></view>
        <view>
          <text style="font-size: 28rpx;color: #333333;">累计分配:</text>
          <text style="font-size: 28rpx;color: #333333;">{{userModel.allDays ? userModel.allDays : 0}}</text>
        </view>
      </view>
    </view>
    <view style="height:1rpx; width: 100%;background-color: #EEEEEE;margin-bottom: 6rpx;">
    </view>
    <view class="card-bottom">
      <view style="display: flex; flex-direction: row; justify-content: center; align-items: center;" bind:tap="userMemoClick">
        <image src="../../../images/edit_gray_icon.png" style="height:24rpx;width:24rpx;margin-top: 6rpx;"></image>
        <text style="margin-left:22rpx;color: #777777; font-size: 28rpx;">用户备注</text>
      </view>
      <view style="display: flex; flex-direction: row; justify-content: center; align-items: center;" bind:tap="userPhoneCallClick">
        <image src="../../../images/phone_gray_icon.png" style="height:24rpx;width:24rpx;margin-top: 6rpx;"></image>
        <text style="margin-left:22rpx;color: #777777; font-size: 28rpx;">打电话</text>
      </view>
      <view style="display: flex; flex-direction: row; justify-content: center; align-items: center;" bind:tap="distributeDays">
        <image src="../../../images/download_gray_icon.png" style="height:26rpx;width:26rpx;margin-top: 6rpx;"></image>
        <text style="margin-left:22rpx;color: #777777; font-size: 28rpx;">分配天数</text>
      </view>
    </view>
  </view>
</view>

结果点击“用户备注”之后,在模拟器上正确显示,但在真机无论iOS还是安卓显示都异常,显示如下

回答关注问题邀请回答
收藏

1 个回答

  • Demons
    Demons
    02-21

    请具体描述问题出现的流程,并提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。

    02-21
    有用
    回复
登录 后发表内容