dingyong0214 / ThorUI-uniapp

ThorUI组件库,轻量、简洁的移动端组件库。组件文档地址:https://thorui.cn/doc
MIT License
2.64k stars 396 forks source link

【BUG Report】Sticky 组件,oldScrollTop 为 0 时会不进行更新 #61

Closed lbhsot closed 4 years ago

lbhsot commented 4 years ago

测试环境:微信小程序(根据代码逻辑,应该不只微信小程序有这个问题) 目标: 实现字母索引列表,带有吸顶效果 实现伪代码:

    <scrollview @scroll="onScroll">
        <block v-for="(list, index) in lists"
               :key="index">
          <tui-sticky-wxs :recalc="recalcSticky"
                      :scroll-top="pageTop"
                      sticky-height="60rpx"
                      :sticky-top="stickyTop"
                      container
                      :is-native-header="false"
                      :index="index"
                      @change="stickyChange">
            <template v-slot:header>
              <view>
                {{ list.letter }}
              </view>
            </template>
            <template v-slot:content>
              <view 
                    @tap="tap(item)"
                    v-for="(item, index2) in list.data"
                    :key="index2">
                <view>
                  {{ item.xx }}
                </view>
              </view>
            </template>
          </tui-sticky-wxs>
        </block>
    </scrollview>

    onScroll(e) {
        this.pageTop = e.detail.scrollTop
    },

这里的 pageTop 在最上端的时候会为 0,在 tui-sticky.wxs 文件中的第二行 if(!oldScrollTop) return false;,这里这里会在 0 的时候直接返回,表现为:在索引最上端(如:A)的时候,点击任意其他的索引,发现最上端的 sticky 没有更新

目前我的解决方案时直接改了这一行代码:if(oldScrollTop !== 0 && !oldScrollTop) return false;

Demo 中似乎也有类似的问题?不过好像是 tui-sticky.vue 这个组件实现的

dingyong0214 commented 4 years ago

感谢反馈,我排查一下