uniapp中flex布局gap属性兼容处理

使用场景:

flex布局中的gap属性对于旧版本机型存在不适配问题

解决方案:
1.新建minins.scss

javascript 复制代码
/* mixins.scss */
@mixin flexGap($size, $direction) {
  @if $direction == column {
    & > * {
      margin-bottom: $size;
    }
    & > *:last-child {
      margin-bottom: 0;
    }
  } @else {
    & > * {
      margin-right: $size;
    }
    & > *:last-child {
      margin-right: 0;
    }
  }
}

/* mixins.scss */

2.uni.scss中引入minins.scss

javascript 复制代码
@import './common/mixins.scss';
相关推荐
行走的陀螺仪8 小时前
uni-app + Vue3编辑页/新增页面给列表页传参
前端·vue.js·uni-app
森之鸟10 小时前
uniapp——配置鸿蒙环境,进行真机调试
华为·uni-app·harmonyos
2501_9159184112 小时前
常见 iOS 抓包工具的使用,从代理抓包、设备抓包到数据流抓包
android·ios·小程序·https·uni-app·iphone·webview
handsome091614 小时前
uniapp打包的app,报This app was built with the iOS 18.1 SDK解决方案
ios·uni-app
yqcoder14 小时前
uni-app 之 下拉刷新
运维·服务器·uni-app
liu_bees17 小时前
微信小程序Canvas生成图片失败:canvas is empty问题解析
微信小程序·小程序·uni-app·vue
木子啊18 小时前
Uni-app性能优化:分包与长列表实战
性能优化·uni-app
yqcoder19 小时前
uni-app 之 设置 tabBar
运维·服务器·uni-app
家里有只小肥猫20 小时前
uniApp下拉渐变头部 拿来即用
前端·javascript·uni-app
fanruitian1 天前
uniapp android开发 测试板本与发行版本
前端·javascript·uni-app