微信scroll-view增强特性

1、需求:scroll-view需要根据需求滚动到指定位置

2、实操:

html(需要开启enhanced)

    <scroll-view id="tab-box" enhanced scroll-x class="c_right_sidebar" wx:if="{{secondary}}">
        <view data-index="{{index}}" class="c_right_sidebar_item {{tabActive==index?'tabActive':''}}" wx:for="{{[1,2,3,4,5,6,7]}}" wx:key="index" bindtap="clickSecondary">
         {{index+1}}级按钮
        </view>
    </scroll-view>

js

    clickSecondary(e: any): void {
      console.log(e)
        this.createSelectorQuery().select('#tab-box').node().exec((ele: any) => {
          const scrollView = ele[0].node;
          scrollView.scrollTo({
            left: e.currentTarget.offsetLeft
          })
        })
        this.setData({
          tabActive:e.currentTarget.dataset.index
        })
    },

 

posted @ 2022-06-14 14:46  Pavetr  阅读(187)  评论(0)    收藏  举报