Switch

Switchは、オンとオフの状態を切り替えるために使用されるコンポーネントです。

ソース @yamada-ui/switch

Props

SwitchIconProps

タイプ

boolean

タイプ

boolean

タイプ

boolean

タイプ

boolean

非推奨

Use active instead.

タイプ

boolean

非推奨

Use checked instead.

タイプ

boolean

非推奨

Use focused instead.

タイプ

boolean

非推奨

Use hovered instead.

タイプ

boolean

SwitchProps

説明

If true, the checkbox will be checked.

タイプ

boolean

デフォルト

false

説明

The visual color appearance of the component.

タイプ

"blackAlpha" | "whiteAlpha" | "amber" | "blue" | "info" | "link" | "primary" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "success" | "indigo" | "lime" | "neutral" | "orange" | "warning" | "pink" | "purple" | "red" | "danger" | "rose" | "sky" | "teal" | "violet" | "secondary" | "yellow"

デフォルト

"primary"

説明

If true, the checkbox will be initially checked.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be initially checked.

非推奨

Use defaultChecked instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be disabled.

タイプ

boolean

デフォルト

false

説明

The switch icon to use.

タイプ

ReactElement<SwitchIconProps,
string | JSXElementConstructor<any>>

説明

id assigned to input.

タイプ

string

説明

If true, the checkbox will be indeterminate.

タイプ

boolean

デフォルト

false

説明

Props for switch input element.

タイプ

InputHTMLAttributes<HTMLInputElement>

説明

If true, the form control will be invalid.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be checked.

非推奨

Use checked instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be disabled.

非推奨

Use disabled instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be invalid.

非推奨

Use invalid instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be readonly.

非推奨

Use readOnly instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be required.

非推奨

Use required instead.

タイプ

boolean

デフォルト

false

説明

Change switch label from right to left.

非推奨

Use reverse instead.

タイプ

boolean

デフォルト

false

説明

Props for switch label element.

タイプ

HTMLUIProps<"span">

説明

The HTML name attribute used for forms.

タイプ

string

説明

The callback invoked when the checkbox is blurred.

タイプ

FocusEventHandler<HTMLInputElement>

説明

The callback invoked when the checked state changes.

タイプ

ChangeEventHandler<HTMLInputElement>

説明

The callback invoked when the checkbox is focused.

タイプ

FocusEventHandler<HTMLInputElement>

説明

If true, the form control will be readonly.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be required.

タイプ

boolean

デフォルト

false

説明

Change switch label from right to left.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be selected when the Enter key is pressed.

タイプ

boolean

デフォルト

false

説明

The size of the Switch.

タイプ

"sm" | "md" | "lg"

デフォルト

"md"

説明

The tab-index property of the underlying input element.

タイプ

number

説明

Motion transition settings.

タイプ

Transition$1

説明

The value to be used in the checkbox input.

タイプ

string

説明

The variant of the Switch.

タイプ

"thin" | "thick"

デフォルト

"thick"

GitHubでこのページを編集する

前CheckboxCard 次Toggle