在uni的入坑第一天就碰見一個小問題。
scroll-view 可視區域滾動組件 豎向滾動好說
// 給scroll-view設置一個高度就可以
<scroll-view scroll-y="true">
<view class="item1">
</view>
<view class="item2">
</view>
<view class="item3">
</view>
</scroll-view>
// 樣式
scroll-view{
width: 100%;
height: 300rpx;
}
但是橫向設置滾動的時候就有問題 滾動不了 我先展示下 解決方法的代碼
後來才知道 原來 scroll-view 裏面的是 塊元素 我想着既然橫向滾動 我就讓他彈性佈局 子元素橫向佈局 但是 設置之後 不生效 只好使用子元素: display:inline-block;
scroll-view: white-space:nowrap;
這樣就可以實現了.
還有一點就是 裏面的 子元素寬度總和 最好要超過 父元素 要不怎麼橫向滾動的是吧
<scroll-view scroll-x="true">
<view class="item1">
</view>
<view class="item2">
</view>
<view class="item3">
</view>
</scroll-view>
scroll-view{
width: 100%;
height: 300rpx;
white-space: nowrap;
}
.item1,.item2,.item3{
display: inline-block;
width: 100%;
height: 100%;
}
.item1{
background-color: #007AFF;
}
.item2{
background-color: #333333;
}
.item3{
background-color: #4CD964;
}