账户中心 退出系统
普通版本 weex版本

graceUI For Weex - 可切换导航


graceNavBar 组件属性

currentIndex : {type : Number,default : 0}, // 激活索引
size : {type : Number,default : 120},// 宽度 单位 rpx
items : {type : Array,default : function () {return []}}, // 导航项目 数组形式
activeLineBg : {type : String,default : "linear-gradient(to right, #66BFFF,#3388FF)"}, // 激活条颜色
activeColor:{type : String,default : "#333333"},// 激活文本颜色
activeLineHeight : {type : Number,default : 6},// 激活条高度
activeLineWidth : {type : String,default : "36rpx"}, // 激活条宽度
color : {type : String,default : "#333333"},// 导航文本颜色
margin : {type : Number,default : 0},// 右侧间距 单位 rpx
textAlign : {type : String,default : 'left'},// 文本布局方式
lineHeight : {type : Number,default : 50},// 文本行高,单位 rpx
fontSize : {type : String,default : '28rpx'}// 文本大小

组件事件 - change

点击导航进行切换时会激活 change 事件,并传递对应的索引值;

演示代码