uniapp scroll-view横向滚动不起效、纵向滚动自适应高度

1.scroll-view纵向滚动自适应高度

使用竖向滚动时,需要给 一个固定高度,通过 css 设置 height;

如果不想写死、不想通过js计算,希望灵活获取高度应该怎么做呢,用css即可

示例:

//外层
<view style="display: flex;
		flex-flow: column;
		height: 100vh; // 100%">
		<view>内容1</view>
		<view>内容2</view>
		<view style="flex: 1;overflow-y: auto;padding-bottom: 20px;">
		    <scroll-view scroll-y="true" style="height: 100%;">
		    滚动区域
		    </scroll-view>
		</view>
<view>

即可;
后面在真机测试下

纵向滚动还遇到问题,切换到不同tab时,滚动条不复位,依然保持在上一次的滚动位置;
增加 :scroll-top=“scrollTop”,在切换tab时把scrollTop = 0

<scroll-view scroll-y="true" style="height: 100%;" :scroll-top="scrollTop">

但这样写没有生效,哎,为什么呢

得这样写,先设置一个非0值

    	  this.scrollTop = 999 
          this.$nextTick(() => {
            this.scrollTop = 0
          })


2.scroll-view横向滚动不起效

你可能感兴趣的:(前端,uni-app,前端)