react-native-tabcontrol

选项卡

Getting started

安装

npm install react-native-tabcontrol --save

使用

// ...

import TabView from 'react-native-tabcontrol';

class MyApp extends Component{
	return (
		<TabView
				// hasAnimated={false}
				// hasUnderline={false}
				hasRedDot={true}

				data={[
					{
						value: '全部'
					},
					{
						value: '降价(99+)',
						unread: 5
					},
					{
						value: '失效(8)'
					}
				]}

				// tintColor='green'

				// currentIndex={0}

				onChange={(item, index)=>{
					// alert('index:' + index + '\n' + 'value:' + item.value);
					item.unread = 0
				}}
			/>
	)
}

API

• data - (Array) - 数据，必须
  • (Object)
    • value - (String) - 显示项
    • unread - (Number) - 未读数量，可选；小红点根据该属性显示
• currentIndex - (Number) - 初始化选中项，默认0
• onChange - (Function) - 切换选项回调；
  • param1: item - (Object) - 当前选项
  • param2: index - (Number) - 索引位置
• textColor - (String) - 文本颜色
• tintColor - (String) - 显示颜色
• barTintColor - (String) - 背景颜色
• underlayColor - (String) - 触摸操作时显示出来的底层的颜色
• hasUnderline - (Boolean) - 高亮时有下划线，默认true
• hasAnimated - (Boolean) - 切换显示下划线动画，默认true
• hasRedDot - (Boolean) - 小红点，默认false