wxml
<scroll-view scroll-x="true" class="scroll-view_x" style="width: auto;overflow:hidden;" lower-threshold = "50" bindscrolltolower = "bookNext">
<view class='list' wx:if="{{booklist.length>0}}" style="display: inline-block;">
<view class='item' wx:for="{{booklist}}" wx:key="{{item}}" bindtap='bindViewTap' id="{{item.id}}">
<image class='coverImg' src='{{item.cover}}'></image>
<text>{{item.name}}</text>
</view>
</view>
</scroll-view>
wxss
.list{
white-space: nowrap; // 重点
}
.list .item{
width: 250rpx;
display: inline-block;
}
.list .coverImg{
display: flex;
width: 190rpx;
height: 258rpx;
margin: 0 auto;
}
.list .item text{
/* display: flex; */
color: #999;
font-size: 20rpx;
padding-top: 20rpx;
display: -webkit-box;
text-align: center;
word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp:1;
}