GraceUI 切换导航 · 多行模式



切换导航·多行模式

组件介绍

gui-switch-navigation2 多行切换导航组件可以快速帮您实现多种形式的分类、状态导航，是一个非常常用、好用的组件;

组件名称

gui-switch-navigation2 : /graceUI/组件目录/gui-switch-navigation2

兼容平台

H5	APP	小程序	NVUE
✔	✔	✔	✔

组件属性

属性名称	类型	默认值	作用
width	Number	690	组件宽度，单位 rpx
isCenter	Boolean	false	项目整体居中
currentIndex	Number	0	选中项目索引
size	Number	138	选项宽度，单位 rpx
fontSize	String	28rpx	文本尺寸
activeFontSize	String	28rpx	激活后文本尺寸
lineHeight	Number	52	导航标题行高，单位 rpx
fontSizeSmall	String	22rpx	描述文本尺寸
lineHeightSamll	Number	28rpx	描述文本行高
items	Array	[]	导航选项数组，格式: [{title:'*', desc:'*'},......]
color	String	#333333	导航文本默认颜色
descColor	String	#999999	描述文本默认颜色
activeColor	String	#3688FF	激活文本颜色
scorllAnimation	Boolean	true	是否产生滚动动画

演示代码

UNI 普通版本

NVUE 版本

登录并购买 GraceUI 后可以查阅完整手册内容。