uniapp的scroll-view总是将顶部的navigationBar一起滚动怎么办呢?

我自己设置了自定义的顶部bar,然后想在下面弄一个滚动区域(不包含顶部bar),也给下面的区域设置了高度,但是还是会把顶部的bar一起滚走,我是跟着老师的视频敲的,但是老师那边是没有问题的,想问一下这是怎么回事呢,是出现了bug吗还是写法变了呢?麻烦各位大佬了,感恩!!

结构

<template>
    <view class="index">
        <!-- 顶部的navigationBar(自定义) -->
        <music-head title="网易云音乐" :icon="true"></music-head>
        <!-- 下面滚动的区域 -->
        <view class="container">
            <scroll-view scroll-y="true" >
                <view>测试</view>
                <view>测试</view>
                <view>测试</view>
                 //下面省略n个
                
            </scroll-view>
            
        </view>
    </view>
</template>

样式

<style lang="scss" scoped>
    .container {
        width: 100%;
        height: calc(100vh -70px);
        // overflow: hidden;
        scroll-view {
            height: 100%;
            width: 100%;
            background-color: khaki;
        }
    }    
</style>

阅读 2.9k
2 个回答

scroll-view 固定高度,比如说 100vh。你现在的问题就是滚动的容器并不是 scroll-view 导致的
或者给 自定义导航设置 position:fixed;top:0;left:0

找到问题啦,需要给scroll-view一个固定的高度,我之前用的是100%,改成了100vh可以了!

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题