scroll-view及内部子元素flex的各种属性均失效

发布于 6 年前作者 yan2413540 次浏览最后编辑 6 年前来自 ask
  • 当前 Bug 的表现(可附上截图)

红色区域横向滚动,内部多个子元素自右向左排列,使用

  • flex-direction:row;

  • flex-wrap:nowrp;

  • 均失效,scroll-view的子元素不会排列一行;

使用网上查阅到的方法在scroll-view上设置white-space: nowrap不换行,子元素display:inline-block;因需求是自右向左排列,即便目前实现了横向滚动,使用

  • flex-direction:row;

  • flex-wrap:nowrp;

  • 仍然失效的,请问如何避免使用scroll-view横向滚动,子元素自右向左排列使用flex布局如何不失效?

  • 预期表现
  • 红色区域横向滚动,内部多个子元素自右向左排列

  • 复现路径

  • 提供一个最简复现 Demo

2 回复
ming40
ming401 楼6 年前

scroll-view支持设置flex的需求还是已开发待发布状态呢:https://developers.weixin.qq.com/community/develop/issue/78

官方组件或是自定义组件,基本都是Shadow DOM,你写在组件下的直接子元素,渲染时未必是直接子元素。


scroll-view里再加一层view设置flex吧。

oma
oma2 楼4 年前

因子元素为行内块元素,在scroll-view使用text-align: right;可实现这个需求