scroll-view先hidden再出现，scroll-into-view无效
发布于 6 年前 作者 junxu 1073 次浏览 来自 问答

scroll-view如果先hidden再出现，scroll-into-view无效

<scroll-view scroll-y style="height: 200px;" scroll-into-view="yellow" hidden>
  <view id="green" class="scroll-view-item bc_green"></view>
  <view id="red"  class="scroll-view-item bc_red"></view>
  <view id="yellow" class="scroll-view-item bc_yellow"></view>
  <view id="blue" class="scroll-view-item bc_blue"></view>
</scroll-view>

先hidden，然后通过setData把hidden去掉，此时scroll-into-view无效

3 回复

把hidden去掉的同时给scroll-into-view重新赋值

你好，麻烦提供能复现问题的简单代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）

刚刚测试了，有效。

<view wx:if='{{show}}'>
 
  <scroll-view scroll-y style="height: 200px;" scroll-into-view="{{intoView}}">
    <view wx:for='{{list}}' wx:key='id{{index}}' id="{{item}}" class="scroll-view-item bc_{{item}}"></view>
  </scroll-view>
 
</view>
 
<view class="btn-area">
  <button size="mini" bindtap="tap">点击让scroll-view出现</button>
</view>
Page({
  data: {
    show: false,
    intoView: null,
    list: ['green', 'red', 'yellow', 'blue']
  },
  onLoad: function () {
  },
  tap: function (e) {
    this.setData({
      show: true,
      intoView: 'yellow'
    })
  },
})
.scroll-view-item {
  width: 100%;
  height: 100px;
}
.bc_green {
  background: green;
}
.bc_red {
  background: red;
}
.bc_yellow {
  background: yellow;
}
.bc_blue {
  background: blue;
}
回到顶部