scroll-y 允许纵向滚动
scroll-top 设置竖向滚动条位置
scroll-with-animation 在设置滚动条位置时使用动画过渡
使用竖向滚动时,需要给 <scroll-view>
一个固定高度,通过 css
设置 height
;
可以使用css
隐藏滚动条样式
/* 隐藏滚动条样式 */
::-webkit-scrollbar {
width: 0;
height: 0;
}
点击changeNav(index)
方法使导航滚动,在计算scrollTop
的滚动距离时,index-2
是为了导航顶部总能显示2个nav-item
,
<template>
<view class="category">
<view class="nav">
<scroll-view
class="bg"
scroll-y="true"
:scroll-top="scrollTop"
:scroll-with-animation="true">
<view class="nav-item"
:class="{'ac':active == index}"
v-for="(item,index) in 28"
:key="index"
@click