メインコンテンツまでスキップ
Version: v6

ion-radio-group

コンテンツ

radio groupはradio buttonsのグループです。 1つのセットから最大1つのradio buttonを選択できます。 radio groupに属するradio buttonを1つ選択すると、 同じグループ内で以前に選択されていたradio buttonの選択が解除されます。

Interfaces

RadioGroupChangeEventDetail

interface RadioGroupChangeEventDetail<T = any> {
value: T;
}

RadioGroupCustomEvent

必須ではありませんが、このコンポーネントから発行される Ionic イベントでより強く型付けを行うために、CustomEvent インターフェースの代わりにこのインターフェースを使用することが可能です。

interface RadioGroupCustomEvent<T = any> extends CustomEvent {
detail: RadioGroupChangeEventDetail<T>;
target: HTMLIonRadioGroupElement;
}

使い方

<ion-list>
<ion-radio-group>
<ion-list-header>
<ion-label>
Auto Manufacturers
</ion-label>
</ion-list-header>

<ion-item>
<ion-label>Cord</ion-label>
<ion-radio value="cord"></ion-radio>
</ion-item>

<ion-item>
<ion-label>Duesenberg</ion-label>
<ion-radio value="duesenberg"></ion-radio>
</ion-item>

<ion-item>
<ion-label>Hudson</ion-label>
<ion-radio value="hudson"></ion-radio>
</ion-item>

<ion-item>
<ion-label>Packard</ion-label>
<ion-radio value="packard"></ion-radio>
</ion-item>

<ion-item>
<ion-label>Studebaker</ion-label>
<ion-radio value="studebaker"></ion-radio>
</ion-item>
</ion-radio-group>
</ion-list>

プロパティ

allowEmptySelection

DescriptionIf true, the radios can be deselected.
Attributeallow-empty-selection
Typeboolean
Defaultfalse

name

DescriptionThe name of the control, which is submitted with the form data.
Attributename
Typestring
Defaultthis.inputId

value

Descriptionthe value of the radio group.
Attributevalue
Typeany
Defaultundefined

イベント

NameDescription
ionChangeEmitted when the value has changed.

メソッド

No public methods available for this component.

CSS Shadow Parts

No CSS shadow parts available for this component.

CSSカスタムプロパティ

No CSS custom properties available for this component.

Slots

No slots available for this component.