小程序页面滚动?

要在小程序中实现页面滚动,可以使用 <scroll-view> 组件。以下是一个基本的示例:

javascript 复制代码
<template>
  <scroll-view class="container" scroll-y>
    <!-- 这里放置页面内容 -->
    <view class="content">
      <!-- 页面内容 -->
    </view>
  </scroll-view>
</template>

<script>
export default {
  // 这里是页面逻辑
};
</script>

<style>
.container {
  width: 100%;
  height: 100%;
}

.content {
  width: 100%;
  /* 设置内容高度或使用 flex 布局使其撑开高度 */
}
</style>

在这个示例中,<scroll-view> 组件包裹了页面的内容,通过设置 scroll-y 属性来启用垂直滚动。你可以在 .content 类中添加页面的实际内容,当内容高度超过 <scroll-view> 的高度时,就会出现滚动条

相关推荐
nbsaas-boot2 分钟前
[特殊字符] 分享裂变新姿势:用 UniApp + Vue3 玩转小程序页面分享跳转!
小程序·uniapp·notepad++
老A技术联盟5 分钟前
从小白入门,基于Cursor开发一个前端小程序之Cursor 编程实践与案例分析
前端·小程序
you45807 分钟前
小程序学习笔记:使用 MobX 实现全局数据共享,实例创建、计算属性与 Actions 方法
笔记·学习·小程序
风铃喵游8 分钟前
构建引擎: 打造小程序编译器
前端·小程序·架构
sunbyte13 分钟前
50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | ThemeClock(主题时钟)
前端·javascript·css·vue.js·前端框架·tailwindcss
小飞悟22 分钟前
🎯 什么是模块化?CommonJS 和 ES6 Modules 到底有什么区别?小白也能看懂
前端·javascript·设计
浏览器API调用工程师_Taylor22 分钟前
AOP魔法:一招实现登录弹窗的全局拦截与动态处理
前端·javascript·vue.js
FogLetter23 分钟前
初识图片懒加载:让网页像"懒人"一样聪明加载
前端·javascript
微客鸟窝25 分钟前
一文搞懂NVM管理Node.js:从安装到实战全攻略
前端
归于尽25 分钟前
Cookie、Session、JWT 的前世今生
前端