BlueprintJS / React - проблема с извлечением TagInput> значения тега с помощью onClick - PullRequest
Новая
       33

BlueprintJS / React - проблема с извлечением TagInput> значения тега с помощью onClick

0 голосов
/ 20 сентября 2019

В приложении React / BlueprintJS у меня есть TagInput .Мне нужно получить доступ к строковому значению любого тега при нажатии.Для простоты, давайте предположим, что мне просто нужно console.log(value).

Я не могу найти значение тега в обратном вызове.Основываясь на документации , я считаю, что мне нужно передать функцию onClick в tagProps.Однако, ничего из того, что я пробовал, похоже, не возвращает строковое значение.

Я создал базовый пример здесь, смотрите ошибки в консоли после нажатия на любой тег:

https://codesandbox.io/s/blueprint-sandbox-7jsb3?fontsize=14

Warning: This synthetic event is reused for performance reasons. If you're seeing this, you're accessing the property `nativeEvent` on a released/nullified synthetic event. This is set to null. If you must keep the original synthetic event around, use event.persist().

Я был бы очень признателен за толчок в правильном направлении, высоко ценится.

1 Ответ

2 голосов
/ 20 сентября 2019

Я думаю, что само предупреждение само за себя.

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

const handleTagClick = x => console.log(x);

В приведенном выше коде x - это не что иное, как synthetic event, которое обнуляется и высвобождается в пул событий после того, как на экране отображается ваше TagInput.

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

const handleTagClick = x => console.log(x.currentTarget.innerText);

Приведенный выше код напечатает точную цель, по которой щелкают.

Другой способ - использовать event.persist(),

const handleTagClick = x => {
  x.persist();
  console.log(x.currentTarget.innerText);
}

Но я думаю, что это будет очень медленно в вашем случае, поэтому не используйте его.

Узнайте больше о синтетическом событии .

Демо

...