安装
npm install react-native-segmented-control-tab --save
用法
import SegmentedControlTab from 'react-native-segmented-control-tab'
class ConsumerComponent extends Component {
constructor(){
super()
this.state = {
selectedIndex: 0,
};
}
handleIndexChange = (index) => {
this.setState({
...this.state,
selectedIndex: index,
});
}
render() {
return (
<View>
<SegmentedControlTab
values={['First', 'Second', 'Third']}
selectedIndex={this.state.selectedIndex}
onTabPress={this.handleIndexChange}
/>
</View>
);
}
}
属性
| 属性名 | 描述 | 类型 |
|---|---|---|
| values | titles | array |
| selectedIndex | 选择的索引 | number |
| selectedIndices | 好像是多选的时候选择的索引 | arrayOf(PropTypes.number) |
| multiple | 是否要多选 (默认false) | bool |
| borderRadius | 可能是边框我没试过 | number |
| tabsContainerStyle | 看类型就是样式了(没试过谁有兴趣可以试试) | object(styles) |
| tabStyle | 看类型就是样式了(没试过谁有兴趣可以试试) | object(styles) |
| tabTextStyle | 看类型就是样式了(没试过谁有兴趣可以试试) | object(styles) |
| activeTabStyle | 看类型就是样式了(没试过谁有兴趣可以试试) | object(styles) |
| activeTabTextStyle | 看类型就是样式了(没试过谁有兴趣可以试试) | object(styles) |
| onTabPress | 回掉函数 | func |
