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

  • Z时代
  • 2024-02-08
  • 分类：IT

我自己设置了自定义的顶部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一起滚动怎么办呢?

回答：

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

回答：

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

以上是 uniapp的scroll-view总是将顶部的navigationBar一起滚动怎么办呢? 的全部内容， 来源链接： utcz.com/p/933589.html

回到顶部