uniapp nvue 自适应屏幕高度双列布局

最新推荐文章于 2023-05-25 15:22:13 发布

香柠汽水

最新推荐文章于 2023-05-25 15:22:13 发布

阅读量2k

点赞数

文章标签：前端

本文链接：https://blog.csdn.net/m0_64609098/article/details/124775781

版权

<template>
	<view class="content">
		<scroll-view scroll-y="true" class="left">
			<view style="background-color: red;height: 1000px;"></view>
		</scroll-view>

		<view class="right">
			<scroll-view scroll-y="true" class="left">
				<view style="background-color: yellow;height: 3000px;"></view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {};
	},
	methods: {}
};
</script>

<style>
page {
	display: flex;
}
.content {
	border: 1px solid red;
	flex: 1;
	display: flex;
	flex-direction: row;
}

.left {
	border: 1px solid red;
	flex: 1;
}
.right {
	border: 1px solid red;
	flex: 2;
}
</style>