收藏
回答

scroll-view中的item高度不一,但是不设置高度就无法触发滑动监听

框架类型 问题类型 API/组件名称 终端类型 操作系统 微信版本 基础库版本
小程序 Bug scroll-view 客户端 Android 6.6.6 1.9.98

scroll-view中的item高度不一,所以没办法给一个固定的高度,但是不设置固定的高度就无法触发滑动监听bindscrolltoupper,请问有没有办法解决这个问题

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

4 个回答

  • 2018-06-14

    bindscrolltoupper  滚动加载了一页, 在加载第二页的时候, 需要scroll-view上划一点到顶部的距离才能触发,  iOS 比较明显,大概率出现这种情况

    <scroll-view id="chatScrollView" scroll-y style="height: {{height}}px;" upper-threshold="100" bindscroll="scroll" bindscrolltoupper="upper" scroll-top="{{scrollTop}}" scroll-into-view="{{toView}}">


    2018-06-14
    有用
    回复
  • 🍃
    🍃
    2018-06-14
    wx.getSystemInfo({
          success: function (res) {
            var clientHeight = res.windowHeight,
              clientWidth = res.windowWidth,
              rpxR = 750 / clientWidth;
            var calc = clientHeight * rpxR - 90;
     
            that.setData({
              winHeight: calc
            });
          }
        });

    onLond中加入这行代码  data中给个winHeight ,wxml中 scroll-view 标签style中设置height

    <scroll-view scroll-y="true" style='height:{{winHeight-30}}rpx;'>

    可以用加减法控制显示高度

    2018-06-14
    有用
    回复
  • 永恒君
    永恒君
    2018-06-12

    scroll-view 不设高度,滑动区域就和内容一样大,

    等于滑动的是 body,而非 scroll-view,所以最好 scroll-view 能固定高度。


    需求不太清楚,感觉是类似 max-height 的效果,

    如果是这样的话恐怕只能 js 解决了,套个 .wrap 然后用 boundingClientRect 来获取高度。

    2018-06-12
    有用
    回复 2
    • lmq
      lmq
      2018-06-12

      就是现在有个很矛盾的问题,我设置固定高度的话我的item就会有的内容显示不全,有的又会空着一大片空白。但是如果不设置固定高度我就没办法触发bindscrolltoupper这个方法

      2018-06-12
      回复
    • 永恒君
      永恒君
      2018-06-13

      其实依旧没看懂,是 max-height 那样的效果吗,低于某高度以内容高度为容器高度,超出某高度以该高度为滑动区域高度。

      2018-06-13
      回复
  • 卢霄霄
    卢霄霄
    2018-06-12

    就以最大的高度为准呗,这个距离大小,只是影响什么时候加载更多数据吧。除非你的高度差别非常大,大的基本快全屏了,小的只有几十rpx高。

    2018-06-12
    有用
    回复 14
    • lmq
      lmq
      2018-06-12

      确实差距比较大因为有文字和图片长点的图片差不多一张也快全屏了,所以不能这么设置,界面看起来会很丑

      2018-06-12
      回复
    • 卢霄霄
      卢霄霄
      2018-06-12回复lmq

      不对啊,老铁,默认值也有50px,怎么会不触发呢?是因为一次分页的内容太少,还不够滚动吗?

      2018-06-12
      回复
    • lmq
      lmq
      2018-06-12

      我现在不设置任何高度值,他得内容是靠图片的width固定,然后height等比例伸缩的。但是这样就一直触发不了bindscrolltoupper这个方法。

      <scroll-view scroll-y  upper-threshold="50" class="history" scroll-top="{{scrollTop}}" wx:for="{{historyList}}" wx:key='' scroll-into-view = "{{toLast}}" bindscrolltoupper="loadTopMore">


      2018-06-12
      回复
    • 卢霄霄
      卢霄霄
      2018-06-12回复lmq

      方便看下 history这个样式怎么写的吗

      2018-06-12
      回复
    • lmq
      lmq
      2018-06-12

      .history {

      width: 100%;

      }

      只是给这个scroll-view设置了一个宽度


      文字框也只是设置了一个宽度,和padding

      2018-06-12
      回复
    查看更多(9)
登录 后发表内容