- 当前 Bug 的表现（可附上截图）

- 预期表现

- 复现路径

- 提供一个最简复现 Demo

<scroll-view style='height:200px;' scroll-y="true" class="article" scroll-with-animation="true" enable-back-to-top="false" bindscroll="scroll" scroll-top="{{scrollTop}}" scroll-into-view="{{brain}}" >

<image class='left-arrow' src="https://preview.qiantucdn.com/58picmark/original_origin_pic/34/73/30/07358PICE9xDAjIY5weV3MaRk.png!w1024_small" wx:if="{{swiperType}}" class="left-arrow" catchtap="toUp" />

<image class='right-arrow' src="https://preview.qiantucdn.com/58picmark/element_origin_pic/33/62/15/86f58PICYbpa4EtbzmktzMaRk.png!w1024_small" wx:if="{{swiperType}}" class="right-arrow" catchtap="down" />

<view class="articleList" wx:for="{{[1,2,3,4,5]}}" wx:key="index" id='brain{{index}}'>

<view class="tower">

<label>悬疑</label>

<text>{{index+1}}楼</text>

</view>

<view class="content">

<text space='nbsp'>    森林深处有一间小木屋，里面住着一位白发苍苍的老爷爷，小木屋显得独一无二，因为孤身一人的老爷爷，经营着森林里唯一的水果铺。和蔼善良让老爷爷的生意不错，森林里的小动物都喜欢光顾他的小店，也喜欢和老爷爷一起晒晒太阳，聊聊天。它们给老爷爷带来的森林里种种有趣的事情，常常把老爷爷逗笑得胡子都飞了起来，生活再也不会像秋天的落叶一样。</text>

</view>

<view class="foot">

<view>

<icon type="success_no_circle" size="40"/>

<text>填脑洞</text>

</view>

<view>

<icon type="success_no_circle" size="40"/>

<text>200</text>

</view>

<view>

<icon type="success_no_circle" size="40"/>

<text>1k</text>

</view>

</view>

</view>

</scroll-view>

.article {

padding-top: 20rpx;

overflow:hidden;

}

.left-arrow {

position: fixed;

left: 0;

top: 60%;

width: 40rpx;

height: 40rpx;

}

.right-arrow {

position: fixed;

right: 0;

top: 60%;

width: 40rpx;

height: 40rpx;

}

.articleList {

padding-top: 10rpx;

margin: auto;

margin-bottom: 24rpx;

width: 84%;

background:rgba(255,255,255,1);

box-shadow:0rpx 0rpx 10rpx 0rpx rgba(153,153,153,1);

border-radius: 10rpx;

}

.tower {

width: 100%;

font-size: 28rpx;

padding: 60rpx 40rpx 32rpx 40rpx;

}

.tower text {

color:rgba(153,153,153,1);

line-height: 40rpx;

float: right;

margin-right: 70rpx;

}

.tower label {

border: 2rpx solid #8E7037;

padding: 4rpx 20rpx;

color: #8E7037;

}

.content {

width: 88%;

font-size: 34rpx;

color:rgba(51,51,51,1);

line-height: 42rpx;

min-height: 450rpx;

letter-spacing: 2rpx;

margin: auto;

}

.foot {

display: -webkit-flex;

justify-content: space-between;

padding: 22rpx 40rpx;

}

.foot view image {

width: 44rpx;

height: 44rpx;  

margin-right: 10rpx;

}

.foot view text {

color: #666666;

font-size: 32rpx;

}

data: {

articleList: [

],

swiperType: false, //楼层上下切换图片显示

scrollTop: 0,//楼层滚动距离顶部高度

scrollHeight: 0,//整个楼层高度

},

//楼层滚动监听

scroll: function (e) {

if (e.detail.scrollTop > 300) {

this.setData({

swiperType: true

})

} else {

this.setData({

swiperType: false

})

}

this.setData({

scrollTop: e.detail.scrollTop

})

this.setData({

scrollHeight: e.detail.scrollHeight

})

},

//上一楼层

toUp: function (e) {

let height = this.data.scrollHeight / this.data.articleList.length;

if (parseInt((this.data.scrollTop / 320).toString()) == 1) {

this.setData({

brain: 'brain0'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 2) {

this.setData({

brain: 'brain1'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 3) {

this.setData({

brain: 'brain2'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 4) {

this.setData({

brain: 'brain3'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 5) {

this.setData({

brain: 'brain4'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 6) {

this.setData({

brain: 'brain5'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 7) {

this.setData({

brain: 'brain6'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 8) {

this.setData({

brain: 'brain7'

})

}

},

//下一楼层

down: function (e) {

let height = this.data.scrollHeight / this.data.articleList.length;

if (parseInt((this.data.scrollTop / 320).toString()) == 1) {

this.setData({

brain: 'brain2'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 2) {

this.setData({

brain: 'brain3'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 3) {

this.setData({

brain: 'brain4'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 4) {

this.setData({

brain: 'brain5'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 5) {

this.setData({

brain: 'brain6'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 6) {

this.setData({

brain: 'brain7'

})

} else if (parseInt((this.data.scrollTop / 320).toString()) == 7) {

this.setData({

brain: 'brain8'

})

}

},