onItemSingleClick

позволяет различать события одиночного и двойного клика

void onItemSingleClick();

Example

on:{
  onItemSingleClick(id){
    const item = this.getItem(id);
    if (item.$count){
      item.open ? this.close(id) : this.open(id)
    }
  }
}

Related samples

Details

Это событие помогает избежать потенциальных конфликтов, когда вам нужно обрабатывать события одинарного и двойного клика.

Предположим, что у вас есть компонент TreeTable на вашей странице, и вы хотите:

  • редактировать название ветви при двойном клике
  • открыть ветвь при одинарном клике по ее названию.

Редактируемость компонента определяется свойством editable, значение которого должно быть true. Также необходимо настроить editaction для указания действия, которое будет вызывать редактирование.

webix.ui({
  view: "treetable",
  columns: [/* конфигурация столбцов */],
  editable: true,   // редактирование будет запускаться при двойном клике
  editaction: "dblclick" });

Если оставить как в примере выше, treetable не сможет открыть ветвь при клике по названию ветви. Здесь вы можете использовать событие onItemSingleClick. Обработчик принимает 3 параметра:

  • id (number) - обязательный, id ветви
  • event (object) - необязательный. Объект PointerEvent
  • node (object) - необязательный. HTML-узел ветви
webix.ui({
  view: "treetable",
  editable: true, 
  editaction: "dblclick"
  // config
  on:{
    onItemSingleClick(id){       const item = this.getItem(id);
      if (item.$count){
        item.open ? this.close(id) : this.open(id)
      }
    }
  }
});

Теперь компонент знает, как различать одинарные и двойные клики и безопасно выполнять соответствующие операции.

See also
Наверх