<template>
<view>
<scroll-view scroll-y="true" style="height: 400rpx;" :scroll-into-view="bottomId" scroll-with-animation="true">
<view v-for="(item,index) in list">
<view :style=" 'height: 180rpx; background-color:' + item.color"></view>
</view>
<view :id="'p'+(list.length)">底部</view>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
list: [{
"color": "#ff0045",
},
{
"color": "#444344",
},
{
"color": "#ff0045",
},
{
"color": "#444344",
}, {
"color": "#ff0045",
},
{
"color": "#444344",
}, {
"color": "#ff0045",
},
{
"color": "#444344",
}, {
"color": "#ff0045",
},
{
"color": "#444344",
}, {
"color": "#7bf09a",
},
{
"color": "#95a200",
},
],
bottomId: "p0",
num: 0
}
},
onLoad(data) {
setTimeout(() => {
this.num = this.list.length
this.bottomId = 'p' + (this.num)
}, 500)
},
methods: {
}
}
</script>
<style>
</style>