组件 scroll-view
发布于 5 年前 作者 abai 14793 次浏览 来自 问答

使用scroll-view，滑动一行无法滑动，需要鼠标点击上一行的区域滑动，下一行才能滑动

比如说；要滑动 “特色”这一行，鼠标只能在“类型"这一行的范围里左右滑，”特色“这一行才能左右滑动

js代码：

<view class="item-wrap">
       <view class="title">{{title}}:</view>
       <scroll-view class="scroller" scroll-x>
           <repeat for="{{items}}" key="{{index}}">
               <view class="{{current==index?'item active':'item'}}" [@tap](/user/tap)="changeItem({{index}})">{{item}}</view>
           </repeat>
       </scroll-view>
   </view>

css代码：

.item-wrap{
    display: flex;
    border-bottom: 1px solid #ccc;
    white-space: nowrap
}
.title{
    width: 160rpx;
    line-height: 40px
}
.scroller{
    flex: 1;
    line-height: 42px
 
}
.item{
    display: inline-block;
    padding: 0 30rpx;
}
.active{
    background-color: #eee;
    color: orange
}
2 回复

给个代码片段

肯定样式不对。然后，你这是用了什么框架啊，语法跟我的有点不一样啊。

回到顶部