uniapp scroll-view翻转90度后,无法滚动问题,并设置滚动条到最底部
< template>
< view class = "main" >
< view style= "height: 200px;" > < / view>
< view class = "btn-main" >
< view class = "send-message" >
< view class = "sm-list rotate90" style= "background-color: antiquewhite;" >
< scroll- view style= "height: 104px;" scroll- y= "true" class = "scroll-y" >
< view class = "sm-item" >
< view class = "sm-item-text" >
< span class = "sm-item-name" > '观看用户' :< / span>
1111111111111111111111
< / view>
< / view>
< view class = "sm-item" >
< view class = "sm-item-text" >
< span class = "sm-item-name" > '观看用户' :< / span>
22222222222222222222
< / view>
< / view>
< view class = "sm-item" >
< view class = "sm-item-text" >
< span class = "sm-item-name" > '观看用户' :< / span>
3333333333333333333333
< / view>
< / view>
< view class = "sm-item" >
< view class = "sm-item-text" >
< span class = "sm-item-name" > '观看用户' :< / span>
44444444444444444444
< / view>
< / view>
< view class = "sm-item" >
< view class = "sm-item-text" >
< span class = "sm-item-name" > '观看用户' :< / span>
55555555555555555
< / view>
< / view>
< view class = "sm-item" >
< view class = "sm-item-text" >
< span class = "sm-item-name" > '观看用户' :< / span>
666666666666666666
< / view>
< / view>
< view class = "sm-item" >
< view class = "sm-item-text" >
< span class = "sm-item-name" > '观看用户' :< / span>
7777777777777777
< / view>
< / view>
< view class = "sm-item" >
< view class = "sm-item-text" >
< span class = "sm-item-name" > '观看用户' :< / span>
88888888888888888
< / view>
< / view>
< view class = "sm-item" >
< view class = "sm-item-text" >
< span class = "sm-item-name" > '观看用户' :< / span>
9999999999999999999999
< / view>
< / view>
< / scroll- view>
< / view>
< / view>
< / view>
< / view>
< / template>
< script>
export default {
data ( ) {
return {
}
} ,
onLoad ( ) {
setTimeout ( ( ) => {
this . $nextTick ( ( ) => {
let box = this . $el. querySelector ( ".uni-scroll-view-content" )
box. scrollTop = box. scrollHeight
} )
} , 2000 )
} ,
onShow ( ) {
} ,
methods: {
}
}
< / script>
< style lang= "scss" scoped>
page{
background- color: #F5F5F5 ;
}
. rotate90{
transform: rotate ( 90 deg) ;
- ms- transform: rotate ( 90 deg) ;
- moz- transform: rotate ( 90 deg) ;
- webkit- transform: rotate ( 90 deg) ;
- o- transform: rotate ( 90 deg) ;
}
: : v- deep . uni- scroll- view- content{
overflow: auto ! important;
}
< / style>