uniapp scroll-view翻转90度后,无法滚动问题,并设置滚动条到最底部(手写横屏样式)

uniapp scroll-view翻转90度后,无法滚动问题,并设置滚动条到最底部

javascript 复制代码
<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(90deg);
		-ms-transform: rotate(90deg);
		-moz-transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		-o-transform: rotate(90deg);
	}
	::v-deep .uni-scroll-view-content{
		overflow: auto !important;
	}
	
</style>
相关推荐
2501_916007476 小时前
HTTPS 抓包的流程,代理抓包、设备数据线直连抓包、TCP 数据分析
网络协议·tcp/ip·ios·小程序·https·uni-app·iphone
游戏开发爱好者88 小时前
React Native iOS 代码如何加密,JS 打包 和 IPA 混淆
android·javascript·react native·ios·小程序·uni-app·iphone
2501_915918419 小时前
iOS mobileprovision 描述文件管理,新建、下载和内容查看
android·ios·小程序·https·uni-app·iphone·webview
00后程序员张9 小时前
iOS 应用程序使用历史记录和耗能记录怎么查?
android·ios·小程序·https·uni-app·iphone·webview
学亮编程手记10 小时前
Mars-Admin 基于Spring Boot 3 + Vue 3 + UniApp的企业级管理系统
vue.js·spring boot·uni-app
万物得其道者成13 小时前
uni-app CLI:APP 多环境打包(测试/正式)最简配置 + `import.meta.env` 为 `undefined` 的解决
uni-app
毕设源码-邱学长13 小时前
【开题答辩全过程】以 基于 uni-app Node.js 的音乐系统设计与实现为例,包含答辩的问题和答案
uni-app
qq_3168377514 小时前
华为obs 私有桶 音频 使用uniapp 安卓端播放-99的问题
uni-app·音视频
凉辰1 天前
uniapp实现生成海报功能 (开箱即用)
javascript·vue.js·小程序·uni-app
笨笨狗吞噬者1 天前
【uniapp】小程序支持分包引用分包 node_modules 依赖产物打包到分包中
前端·微信小程序·uni-app