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';
相关推荐
自然 醒11 小时前
uni-app开发微信小程序,如何使用towxml去渲染md格式和html标签格式的内容?
微信小程序·uni-app·html
CHB12 小时前
uni-agent,你的数字员工来了
人工智能·uni-app·vibecoding
h_jQuery12 小时前
uniapp使用canvas实现逐字书写任意文字内容,后合成一张图片提交
前端·javascript·uni-app
困困的果果头12 小时前
【uniapp】解决H5嵌套在web-view中时打包页面与状态栏重叠
前端·uni-app
前端 贾公子12 小时前
Uniapp 使用 UQRCode 创建二维码
uni-app
Rattenking12 小时前
uni-app组件开发----自定义数字键盘组件
前端·javascript·uni-app
笨笨狗吞噬者14 小时前
代理的妙用:uni-app 小程序是怎样用 `Proxy` 和 `wrapper` 抹平平台差异的
前端·微信小程序·uni-app
软希网分享源码2 天前
中英双语言量化交易投资源码/跟单搬砖区块链交易所源码/前端uniapp纯源码+后端
前端·uni-app·区块链·中英双语言量化交易投资源码
小成Coder2 天前
UniApp 如何调用鸿蒙预加载
uni-app·harmonyos·鸿蒙