RadioButton

Отображает переключатель для выбора варианта из ограниченного набора

Имеет следующие режимы работы:

• Multiple: отображает список вариантов, определенных в свойстве State, с возможностью выбора с помощью переключателя;
• Single: отображает только один вариант.

  <RadioButton
    Mode="Single"
    Value={3}
    Checked={fooSingle => fooSingle === 3}
    OutputValue-var="fooSingle"
    Label="RadioButton"
  />

Свойства

Имя	Описание	Тип	Значение по умолчанию	Возможные значения
Autofocus	Признак установки фокуса на компонент	boolean
CSS	Массив строк-классов CSS-стилей компонента	array
Checked	Признак выбранного варианта	boolean
DataHint	Подсказка к компоненту	string
Disabled	Признак запрета на редактирование компонента	boolean
Error	Признак ошибки при валидации компонента	boolean
ErrorMessage	Сообщение об ошибке при валидации компонента	string
Focused	Признак фокусировки на компоненте	boolean
Hidden	Признак состояния компонента Скрыт	boolean
HighlightError	Признак подсвечивания ошибки	boolean
Hint	Подсказка над компонентом	string
HintPosition	Сторона — правая или левая — для отображения подсказки	enum	right	left - Слева right - Справа top - Сверху bottom - Снизу topRight - Сверху справа topLeft - Сверху слева bottomRight - Снизу справа bottomLeft - Снизу слева
Id	Идентификатор компонента для навигации к нему на HTML-странице	string
KeyField	Ключ для отрисовки компонента	string
Label	Надпись на компоненте	string
MaxLength	Максимальная длина вводимой строки	number	30
Mode	Режим работы компонента	enum	Multiple	Multiple - Набор значений из свойства State Single - Одно значение; использует свойства Name, Value и OutputValue
Model	Псевдоним свойств Value и OutputValue	any
Name	Имя варианта	string	name
NoWriteOnInit	Признак отказа от записи данных в переменную, заданную в свойствах OutputValue или Model, при создании компонента	boolean
OnBlur	Параметры команды, отправляемой при потере фокуса компонентом	undefined
OnChange	Параметры команды, отправляемой при изменении компонента, например, при вводе текста, выборе из списка	undefined
OnClick	Обработчик события Click	undefined
OnDelay	Параметры команды, отправляемой по истечении секунды (для предотвращения ложного срабатывания обработчика события) после последнего изменения модели данных	undefined
OnEnterKeyDown	Параметры команды, отправляемой по нажатию Enter	undefined
OnKeyDown	Обработчик события KeyDown	undefined
OnKeyUp	Обработчик события KeyUp	undefined
OnMouseDown	Обработчик события MouseDown	undefined
OnMouseEnter	Обработчик события MouseEnter	undefined
OnMouseLeave	Обработчик события MouseLeave	undefined
OnMouseMove	Обработчик события MouseMove	undefined
OnMouseOut	Обработчик события MouseOut	undefined
OnMouseOver	Обработчик события MouseOver	undefined
OnMouseUp	Обработчик события MouseUp	undefined
OnUnmount	Обработчик события Unmount	undefined
OutputState	Имя переменной для записи информации, относящейся к состоянию компонента, но не относящейся к данным	any
OutputValue	Привязка отрисованного компонента к модели	any
ReadOnly	Признак отображения компонента в режиме только для чтения	boolean
Required	Признак обязательности наличия загруженного файла	boolean
Slot	Метка для динамического добавления другого компонента по его идентификатору	string
State	Массив объектов допустимых значений	array
Text	Заполнитель (Placeholder)	string
TitleField	Ключ для подсказки к компоненту	string
Tooltip	Всплывающая подсказка над компонентом, чаще используемая для пояснения назначения значка	any
TraceId	Идентификатор для отслеживания состояния компонента исходя из хронологической последовательности: создание, отрисовка, обновление, удаление; используется для выполнения фрагмента кода по изменению состояния компонента	string
Validation	Признак ошибки валидации компонента; используется только для совместимости с версиями Платформы Multi-D до 0.6	boolean
Value	Привязка модели к отрисованному компоненту	any
ValueField	Ключ для записи в модель	string
Visible	Признак инверсии состояния компонента Скрыт	boolean	True
WriteMode	Имя события, по которому меняется значение переменной состояния (экранной формы), переданной в качестве OutputValue	enum		- Режим ввода без контроля состояния компонента

Примеры

JSX:

<Group Mode={"Column"}>
    <Group Mode="Row" Height="auto" CSS={['mb-24']}>
      <Group Mode="Column">
      <Text Mode="Medium_20" Value="Без текста" CSS={['mb-24']} />
      <Text Mode="Regular_14_2" Value="Использутся в таблице" />
    </Group>
    <Group Mode="Column" CSS={['mt-24']}>
      <Text Mode="Medium_18" Value="" CSS={['mb-24']} />
      <RadioButton
        Name="textLess"
        Mode="Single"
        Value={1}
        Checked={fooSingle1 => fooSingle1 === 1}
        OutputValue-var="fooSingle1"
        Label=""
        CSS={['mb-8']}
      />
    </Group>
    <Group Mode="Column" CSS={['mt-24']}>
      <Text Mode="Medium_18" Value="" CSS={['mb-24']} />
      <RadioButton
        Name="textLess"
        Mode="Single"
        Value={2}
        Checked={fooSingle1 => fooSingle1 === 2}
        OutputValue-var="fooSingle1"
        Label=""
        Error={() => 'Описание ошибки'}
        CSS={['mb-8']}
      />
    </Group>
  </Group>
  <Group Mode="Row">
      <Group Mode="Column">
      <Text Mode="Medium_20" Value="С текстом" CSS={['mb-24']} />
      <Text Mode="Regular_14_2" Value="Использутся везде кроме таблицы" />
    </Group>
    <Group Mode="Column" CSS={['mt-24']}>
      <Text Mode="Medium_18" Value="" CSS={['mb-24']} />
      <RadioButton
        Name="withText"
        Mode="Single"
        Value={3}
        Checked={fooSingle2 => fooSingle2 === 3}
        OutputValue-var="fooSingle2"
        Label="Название опции"
        CSS={['mb-8']}
      />
    </Group>
    <Group Mode="Column" CSS={['mt-24']}>
      <Text Mode="Medium_18" Value="" CSS={['mb-24']} />
      <RadioButton
        Name="withText"
        Mode="Single"
        Value={4}
        Checked={fooSingle2 => fooSingle2 === 4}
        OutputValue-var="fooSingle2"
        Label="Название опции"
        Error={() => 'Описание ошибки'}
        CSS={['mb-8']}
      />
    </Group>
  </Group>
</Group>