-
uni-app popup 抖音小程序底部安全区留白问题
现象 uni-popup控件，底部弹出时出现了34px的空白。 safe-area属性默认为true，表示适配底部安全区，但不生效。 解决 显式指定safe-area为false。 同时为了兼容H5
2025-08-14, Views: 12 , Topics: uni-app
-
uni-app 全局 CSS 样式
App.vue <style> /*每个页面公共css */ page { min-height: calc(100vh - var(--status-bar-heigh
2025-08-13, Views: 20 , Topics: uni-app
-
uni-app 模态弹窗提示框
代码 uni.showModal({ title: '恭喜您', content: `获得奖品`, showCancel: false, confirmText: '
2025-08-12, Views: 25 , Topics: uni-app
-
uni-app popup 弹出时字体闪烁解决方法
现象 uni-popup弹出时，字体会闪烁一下，应该是多次绘制导致。 解决 禁用动画。 代码 :animation="false" <uni-popup ref="popup" :mask-clic
2025-08-11, Views: 28 , Topics: uni-app
-
uni-app image 元素在 flex column 布局下宽度为 0 的问题
现象 在flex column布局中，image元素指定了width: 100%，但实际渲染时宽度变为0了。 去掉width: 100%，图片就有实际宽度了。 原因 在flex-direction:
-
uni-app flex column 布局中图片高度被压缩
场景 需要给根元素设置背景，所以给根元素设置了height: 100vh以保证背景能覆盖整个屏幕。 但此时发现图片mode="widthFix"、style="width: 100%"，高度被压缩了
-
uni-app flex 1 纵向无法占据全部高度
场景 需要给根元素设置背景以保证整个屏幕有背景色。 设置了子元素flex: 1却没有占据整个屏幕。 解决方法 设置根元素min-height: 100vh。
-
uni-app CSS 内置变量：系统状态栏高度、NavigationBar 的高度、TabBar 的高度
变量 变量 描述 小程序 H5 --status-bar-height 系统状态栏高度 25px 0 --window-top 内容区域距离顶部的距离 0 NavigationBar
-
uni-app 页面生命周期
页面生命周期 函数名 说明 onInit 监听页面初始化，其参数同 onLoad 参数，为上个页面传递的数据，参数类型为 Object（用于页面传参），触发时机早于 onLoad o
2025-08-06, Views: 48 , Topics: uni-app
-
uni-app wu-calendar 设置控件高度
场景 wu-calendar默认高度太高，需要调整，设置height无效。 解决 wu-calendar提供了设置itemHeight的属性，用来设置每个日期方格的高度，从而间接达到设置整个组件高度
2025-08-05, Views: 57 , Topics: uni-app wu-calendar
-
uni-app wu-calendar 基本使用
组件属性 属性名 说明 类型 默认值 可选值 date 自定义默认选中时间，默认为今天，mode="multiple"或"range"时，该值需为数组，mode="single"，该值为
2025-08-04, Views: 65 , Topics: uni-app wu-calendar
-
uni-app wu-calendar 解决抖音小程序中布局错乱问题
现象 在抖音小程序中，wu-calendar 1.5.6版本中，日期item都挤压在一起。 原因 flex布局没有添加属性flex: 1。 解决 uni_modules-wu-calendar-co
2025-08-03, Views: 60 , Topics: uni-app wu-calendar flex
-
uni-app image 图片组件不同 mode
代码 默认mode为scaleToFill。 默认宽度320px、高度240px。 <image src="/static/a.jpg" mode="scaleToFill"></image> 常
-
uni-app 设置背景图片
方法一：加载网络图片 <view style="min-height: 100vh;background-image: url(https://xxx.com/aaa.jpeg);"> </view
2025-08-01, Views: 78 , Topics: uni-app
-
uni-app 页面跳转
跳转到普通页面 uni.navigateTo({ url: '/pages/detail/index' }); 跳转到底部导航栏 uni.switchTab({ url: '/pa
2025-07-31, Views: 80 , Topics: uni-app
-
uni-app popup 弹出层
代码 template <uni-popup ref="popup"> <view class="popup-content"> <view style="font: bol
2025-07-30, Views: 84 , Topics: uni-app
-
uni-app 数据本地存储
同步方法 uni.setStorageSync('storage_key', 'hello'); 异步方法 uni.setStorage({ key: 'storage_key',
2025-07-29, Views: 92 , Topics: uni-app
-
uni-app 耗时操作时显示加载中提示框
代码 methods: { getInfo() { uni.showLoading({ title: '加载中', mask:
2025-07-28, Views: 94 , Topics: uni-app
-
uni-app 配置底部导航栏
配置代码 在pages.json中新增tabBar节点，selectedColor指定选中后的文字颜色，list中指定各页面的pagePath、iconPath、text。 { "tabBa
2025-07-26, Views: 101 , Topics: uni-app
-
uni-app 网络请求添加拦截器
示例代码 uni.addInterceptor('request', { invoke(args) { // request 触发前拼接 url args.url = 'http
2025-07-26, Views: 108 , Topics: uni-app