uniapp scroll-view横向滚动无效,scroll-view子元素flex布局不生效

要素排查:

1.scroll-x属性需要开启,官方类型是Boolean,实际字符串也行。

2scroll-view标签需要给予一个固定宽度,可以是百分百也可以是固定宽度或者100vw。

3.子元素需要设置display: inline-block(行内块元素)属性,scroll-view需要设置white-space: nowrap(不换行)

当使用scroll-view横向滚动的时候一般场景都是有多个子元素超出屏幕宽度了需要滑动,所以需要给予子元素display: inline-block属性

flex布局:

scroll-view的子元素需要设置flex布局的时候需要设置:enable-flex="true"属性开启flex布局

当子元素item里面还有其他元素需要设置display:flex,这是设置子元素为display: inline-block就不能设置为flex布局, 这时就需要给子元素里面的子元素都设置成inline-block或者其他布局了,然后再调整样式。

相关推荐
a1117762 小时前
坦克大战3D Three.js 3D (开源项目)
开发语言·javascript·3d
kyriewen3 小时前
别再乱用useEffect了——你写的10个里有8个不该存在
前端·javascript·react.js
Ivanqhz3 小时前
Rust &‘static str浅析
java·前端·javascript·rust
IT_陈寒4 小时前
SpringBoot这个分页坑,我踩了三天才爬出来
前端·人工智能·后端
颜酱4 小时前
05 | 召回前置准备:根据业务数据库生成各数据库(读取配置阶段)
前端·人工智能·后端
zandy10114 小时前
衡石 Agentic BI的ReAct 推理框架在 Agentic BI 中的工程化实践
前端·javascript·react.js
罗超驿5 小时前
JavaEE进阶之路:从Web架构原理到HTML标签全解析
前端·html·web·javaee
西安小哥5 小时前
从前端到AI工程师:一场跨越鸿沟的真实蜕变之旅
前端
Prince4185 小时前
侧边栏收起缩放适配方案
前端
用户7783366132115 小时前
serpbase + Cloudflare R2 边缘持久化实战
前端·人工智能