收藏
回答

关于scroll-view 监听滚动 改变页面样式问题

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug scroll-view 客户端 6.7.3 2.3.0

- 当前 Bug 的表现(可附上截图)


- 预期表现


- 复现路径pages/food/catering


- 提供一个最简复现 Demo


wxml  太多 无法提供

使用的是scroll-view

下面是滚动事件  样式布局属于正常

滚动事件的渲染出现了比较严重的延迟  无法达到预期效果

从而演变为bug  其中安卓(vivox7)手机最为明显  苹果(7ps)手机没有出现



scroll: function(e) {

var self = this;

var height = self.data.height

var TopHeight;

var opos = self.data.opos;

if (self.data.soll == false) {

if (e.detail.scrollTop > height) {

if (isOpps == false) {

isOpps = true;

opos = true,

height = e.detail.scrollTop

if (e.detail.scrollTop <= 270) {

TopHeight = 270

}

}

} else {

if (isOpps == true) {

isOpps = false

opos = false

}

}

self.setData({

TopHeight: TopHeight,

opos: opos,

height: height

})

}


if (timer) {

clearTimeout(timer)

}

timer = setTimeout(function() {

var fyArrId = self.data.fyArrId

var GcArr = self.data.firstClass

console.log(GcArr)

if (self.data.soll == false) {

// 判断 距离

var scale = e.detail.scrollWidth / 600,

scrollTop = e.detail.scrollTop / scale,

h = 0,

classifySeleted = 0;

// self.data.GcArr.forEach(function(classify, i) {

//   // 标题栏 70

//   // 每项的个数 classify.goods.length

//   var _h = 96 + classify.goodsjson.length * 174;

//   if (scrollTop >= h) {

//     classifySeleted = fyArrId[i].gc_id;

//   }

//   h += _h;

// });

for (var i = 0; i < fyArrId.length; i++) {

if (scrollTop >= fyArrId[i]) {

classifySeleted = GcArr[i].gc_id;

}

}

console.log("pp" + classifySeleted)

self.setData({

flId: classifySeleted

});

} else {

self.setData({

soll: false

});

}

timer = undefined;

}, 100)


},



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

4 个回答

  • ThenMorning
    ThenMorning
    2018-11-26

    遇到同样问题,代码已经优化,在2s内 调用 setData 大概 8次 左右,会有延时,坐等解决方案

    2018-11-26
    有用 1
    回复
  • manymore13
    manymore13
    2019-01-11

    这个问题有没有解决方法?

    2019-01-11
    有用
    回复 1
    • AwakenSky
      AwakenSky
      2019-01-11

      米有 只是简化了功能

      2019-01-11
      回复
  • 2018-11-27

    https://developers.weixin.qq.com/community/develop/doc/00088aa513c4a0af8db7e02e156800?highLine=setData%25E5%25BB%25B6%25E8%25BF%259F

    遇到同样的问题。

    2018-11-27
    有用
    回复
  • Code Weaver
    Code Weaver
    2018-10-16

    = =是滚动的 时候设置它悬浮在顶部么?

    2018-10-16
    有用
    回复 4
    • AwakenSky
      AwakenSky
      2018-10-16

      这个是仿造饿了吗 菜单页面  滚动到一定高度 左侧scroll  fixed 到最上面  效果可以实现  但是出现延迟  卡顿了两三秒才出现预期的效果

      2018-10-16
      回复
    • Code Weaver
      Code Weaver
      2018-10-16

      因为滚动的时候会频繁setData 会导致性能变差。。我的也有这种问题,在开发者工具上 效果很明显,手机上好很多。

      2018-10-16
      回复
    • AwakenSky
      AwakenSky
      2018-10-18回复Code Weaver

      请问有没有优化的 方法啊    这个 真的是有点尴尬

      2018-10-18
      回复
    • Code Weaver
      Code Weaver
      2018-10-22回复AwakenSky

      这个 我暂时没有,不过社区 应该有大神 有吧

      2018-10-22
      回复
登录 后发表内容