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

作者站长头像
站长
· 阅读数 17

我自己设置了自定义的顶部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>

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

回复
1个回答
avatar
test
2024-07-11

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

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容