Документация Толоки

layout.compare

Обратите внимание

Документация на русском языке может быть устаревшей. Самые последние изменения доступны в документации на английском языке.

Позволяет расставить элементы интерфейса так, чтобы сравнивать их между собой. Например, можно сравнить несколько фото.

Кнопки выбора можно расположить под каждым из сравниваемых элементов. Также можно добавить общие элементы, например поле для ввода комментария.

Отличия от layout.side-by-side:

  • Нет кнопок, позволяющих скрывать элементы. Они пригодятся, если надо сравнить сразу 5 фотографий и тяжело сделать выбор между какими-то двумя.
  • Для каждого сравниваемого элемента можно добавить свои кнопки выбора.

Свойства компонента

Название

Тип

Описание

type*

"layout.compare"

Задает тип компонента.

commonControls

view

Общие поля компонента. Добавьте блоки информации, которые относятся ко всем элементам сравнения.

items*

array

Массив со свойствами элементов сравнения. Задайте внешний вид блоков компонента.

items[]

object

Элемент сравнения.

items[].content

view

Содержание элемента сравнения. Добавьте в элемент сравнения картинки, аудиозаписи, видео, ссылки или другие типы данных.

items[].controls

view

Настройте поля ввода, чтобы исполнитель выбрал один из элементов.

minWidth

number

Минимальная ширина элемента в пикселях. Значение по умолчанию: 400 пикселей.

validation

condition

Валидация на основе условия (condition).

wideCommonControls

boolean

Свойство увеличивает общие поля элементов сравнения. По умолчанию false — общие поля не растягиваются и отображаются по центру. Если true, то поля будут шире, чем со значением по умолчанию.