小程序scroll-view 设置scroll-y=false 不管用的问题

问题:
利用scroll-view组件横向滚动实现步骤条效果,每个子元素下使用到scroll-view组件纵向滚动。
小程序开发工具上正常,在真机上滚动子元素内容时,页面会跳到第一个子页面。

正常情况下如下图:
小程序scroll-view 设置scroll-y=false 不管用的问题_第1张图片
滚动疫苗页面后内容错位,如下图:
小程序scroll-view 设置scroll-y=false 不管用的问题_第2张图片
排查,在真机上查看元素结构时,发现父元素scroll-view允许纵向滚动。
小程序scroll-view 设置scroll-y=false 不管用的问题_第3张图片
查看代码,发现设置了scroll-y=“false”,貌似并未起作用。
在这里插入图片描述
仔细查看文档,发现了自己的错误。
小程序scroll-view 设置scroll-y=false 不管用的问题_第4张图片
凡是布尔类型的属性,都跟 HTML5 标准是一样的,写值了就是 true,不写才是 false。小程序会对布尔类型的变量特殊处理,scroll-y=“false” 这个明显就是个字符串 “false” 而不是变量。

所以,想要 scroll-view 禁止纵向滚动,要么压根不写 scroll-y 属性,要么用 scroll-y="{{flag}}" 变量来控制。

你可能感兴趣的:(problems)