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或者其他布局了,然后再调整样式。

相关推荐
_洋1 小时前
Three.js加载 .obj文件 和 .gltf文件
开发语言·javascript·ecmascript
梦想CAD控件1 小时前
网页端对DWG图纸进行预览与批注(CAD轻量化)
java·前端·javascript
JustNow_Man2 小时前
【opencode】安装使用daytona沙箱插件
android·java·javascript
不吃土豆的马铃薯2 小时前
Spdlog 进阶:日志基本控制、日志格式控制、异步记录器
linux·服务器·开发语言·前端·c++
wait2 小时前
Vibe Coding 开发技巧
前端·javascript·人工智能
ZengLiangYi2 小时前
Vercel AI SDK 入门:一行代码切换 LLM Provider
前端·javascript·aigc
三乐2282 小时前
原型链是什么?五分钟教会你
javascript
ZengLiangYi2 小时前
Electron 入门:Web 应用打包成桌面软件
前端·electron
前端环境观察室3 小时前
别再靠人工记浏览器环境了:用 TypeScript 设计一套可审计模型
前端
Delicate3 小时前
彻底搞懂JS原型:_ _ proto _ _与prototype的区别到底在哪?
javascript