1、scroll-view必须设置为:white-space: nowrap; 2、item布局最外层,必须为行内布局,例如:inline-block或inline-flex
<view>作品 123445</view> <view>联系电话 134***4152</view> </view> <viewclass="box"> <image src="http://b-ssl.duitang.com/uploads/item/201703/01/20170301163305_sCd8j.gif"class="images"></image> <view>作品 123445</view> <view>联系电话 134***4152</view> </view> </scroll-view>...
本来横向滚动只要子元素宽度大于scroll-view固定宽度就可以滚动的,但是IOS App开发中子元素高度必须要大于scroll-view宽度才能滚动,应该是拿错参数了。 解决方案: scroll-view内部添加一个宽度为1像素的透明的占位View把内部容器的高度撑大即可(下图红色线条所示),高度为子元素的总宽度(下图蓝框),这样无论有多少个子元...
</scroll-view> css .kite-classify-scroll{ width: 100%; height: 150px; overflow: hidden; white-space: nowrap; } .kite-classify-cell{ display: inline-block; width: 115px; height: 140px; } 2、多排横向滚动 html <scroll-view scroll-x="true" class="kite-classify-scroll"> ...
scroll-view重要的三个属性scroll-x="true";overflow: hidden;white-space: nowrap;scroll-view中的ite...
uni 文档中 scroll-view 说明 可滚动视图区域,用于区域滚动。使用竖向滚动时,需要给 scroll-view 一个固定高度,通过 css 设置 height;使用横向滚动时,需要给 scroll-view 添加 white-space: nowrap; 样式。 微信小程序文档中 scroll-view 说明 可滚动视图区域。使用竖向滚动时,需要给scroll-view一个固定高度,通过...
平台兼容性 引入组件即可 <template> <view> <TC-scroll-view></TC-scroll-view> </view> </template> 1. 2. 3. 4. 5. 如需要删除多余的部分 uni_modules/TC-scroll-view/components/TC-scroll-view/TC-scroll-view 以上路径上进行修改即可
scroll-x 使用横向滚动时,需要给添加white-space: nowrap;样式。 scroll-y 使用竖向滚动时,需要给一个固定高度,通过 css 设置 height; 直接写 scroll-x, scroll-y 而不加true也可以 <template><view><scroll-viewclass="scroll"scroll-x="true"scroll-y="true"><viewclass="scroll-item">111</view><view...
1. 上下滚动效果 设置<scroll-view> 的方向 scroll-y 属性 设置<scroll-view> 的 class 样式 height 2.横向滚动效果 设置<scroll-view> 的方向 scroll-x 属性 设置<scroll-view> 的 class 样式 height ,white-space: nowrap 不换行 设置<scroll-view> 内部元素的 class 样式 display: inline-block 将元素设...