微信小程序 半屏弹窗 Half Screen Dialog 手机上不能滚动

如下示例,
问题1:在微信开发者工具的模拟器没问题,真机上不能滚动。
问题2:弹窗打开时,标题自动获取焦点,处于“选中”状态,外面会有一个框,点击别的地方失焦,就消失了。

微信开放社区有个类似问题,将slot="desc"改为如下写法,真机上还是不能滚动!

<scroll-view slot="desc" style="height: 500px;" scroll-y="true">

  <mp-halfScreenDialog bindbuttontap="buttontap" show="{{show}}" maskClosable="{{false}}" mask="{{true}}" tips="辅助提示内容">
    <view slot="title" class="roomDetails-title">
      <view style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width: 220px;">
      </view>
      <text class="member-price" hidden="{{!hotelDetails.memberPrice}}">会员价</text>

    </view>
    <scroll-view slot="desc" style="height: 500px;" scroll-y="true">
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>
        <view>666666666666</view>

    </scroll-view >

    <!--操作按钮区域-->
    <view slot="footer" class="footer-area">
      <view class="total-amount">
        <text>总额: </text>
        <text class="common-color-orange">¥ {{hotelDetails.total}}</text>
      </view>
      <view class="roomDetails-order" bindtap="hotelOrderShow">预 订2</view>
    </view>
  </mp-halfScreenDialog>​

阅读 4.3k
1 个回答

解决办法是这样的:

<view slot="desc">
<scroll-view style="height: 500px;" scroll-y="true">

6666666666666666666666666
6666666666666666666666666
6666666666666666666666666
6666666666666666666666666
6666666666666666666666666

</scroll-view>
</view>​

推荐问题