rc-segmented

React Segmented Control.

Live Demo

https://react-component.github.io/segmented/

Install

Usage

1import Segmented from 'rc-segmented';
2import 'rc-segmented/assets/index.css'; // import 'rc-segmented/asssets/index.less';
3import { render } from 'react-dom';
4
5render(
6  <Segmented
7    options={['Antd', 'Antv', 'Egg.js']}
8    onChange={(value) => handleValueChange(value)}
9  />,
10  mountNode,
11);

API

Please note that onChange API changed on v2.0.0+

Property	Type	Default	Description
prefixCls	string	rc-segmented	prefixCls of this component
className	string	''	additional class name of segmented
style	React.CSSProperties		style properties of segmented
options	Array<string | number | SegmentedOption>	[]	options for choices
value	string | number		value of segmented
defaultValue	string | number		defaultValue of segmented
value	string | number		currently selected value of segmented
onChange	(value: string | number) => void		defaultValue of segmented
disabled	boolean	false	disabled status of segmented

SegmentedOption

Property	Type	Default	Description
label	ReactNode		label of segmented option
value	string | number		value of segmented option
className	string	''	additional class name of segmented option
disabled	boolean	false	disabled status of segmented option

Development

npm install
npm start

License

rc-segmented is released under the MIT license.