swiper組件有overflow: hidden屬性
普通設(shè)置盒子
overflow-x: auto;
white-space: nowrap;
width: 582rpx;
不生效
需要在外面包裹一個(gè)
<scroll-view :scroll-x="true" @touchmove.stop class="scroll-x"> </scroll-view>
:scroll-x="true"設(shè)置橫向滑動(dòng) @touchmove.stop阻止冒泡滑動(dòng)swiper scroll-x設(shè)置寬度
注意 ：
如果croll-view 內(nèi)的盒子有 display: flex;屬性 避免子盒子擠壓
需要加上 white-space: nowrap;
或者子盒子 flex-shrink:0
<scroll-view :scroll-x="true" @touchmove.stop class="scroll-x">
<view class="relation-list">
<view
v-for="(item, index) in personData.guanxi"
:key="index"
class="relation-list-item"
></view>
</scroll-view>
.scroll-x{
width: 660rpx;
}
.relation-list {
display: flex;
white-space: nowrap;
.relation-list-item { ... }
}
