ant-design-vue/components/segmented/index.en-US.md

category	type	title	cover	coverDark	tag
Components	Data Display	Segmented	https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*papwTpNscPIAAAAAAAAAAAAADrJ8AQ/original	https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*tz7qSaWpi1kAAAAAAAAAAAAADrJ8AQ/original	New

Segmented Controls.

When To Use

• When displaying multiple options and user can select a single option;
• When switching the selected option, the content of the associated area changes.

API

Property	Description	Type	Default	Version
block	Option to fit width to its parent's width	boolean	false
disabled	Disable all segments	boolean	false
options	Set children optional	string[] | number[] | SegmentedOption[]	[]
size	The size of the Segmented.	large | middle | small	-
value	Currently selected value	string | number
label	custom label by slot	v-slot:label="SegmentedBaseOption"

events

Events Name	Description	Arguments
change	The callback function that is triggered when the state changes	function(value: string | number)	-

SegmentedBaseOption、 SegmentedOption

interface SegmentedBaseOption {
  value: string | number;
  disabled?: boolean;
  payload?: any; // payload more data
  /**
   * html `title` property for label
   */
  title?: string;
  className?: string;
}
interface SegmentedOption extends SegmentedBaseOption {
  label?: VueNode | ((option: SegmentedBaseOption) => VueNode);
}