APP端

参考文档:uni-app官网

全局配置:

"globalStyle": { // 全局配置
    "scrollIndicator": "none", // 不显示滚动条
    "app-plus": {
        "scrollIndicator": "none" // 在APP平台都不显示滚动条
    }
}

局部配置:

"path": "pages/index/index",
"style": {
    "scrollIndicator": "none", // 该页不显示滚动条
    "app-plus": {
        "scrollIndicator": "none" // 在该页APP平台不显示滚动条
    }
}

注意:配置完毕后,需要重启编辑器并重新编译

微信小程序端

只能使用于在 scroll-view 中

方法一、将滚动条的属性 show-scrollbar 设置为 false 即可

<scroll-view class="wrap" scroll-y enhanced :show-scrollbar="false"></scroll-view>

方法二、通过CSS设置滚动条隐藏

注意:::-webkit-scrollbar前要有 scroll-view 的标签名或类名

scroll-view ::-webkit-scrollbar {
    width: 0;
    height: 0;
    background-color: transparent;
}

scroll-view ::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
    color: transparent;
}
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐