SVG как ReactComponents, двойной щелчок выделяет следующий текст ⇐ CSS
-
Гость
SVG как ReactComponents, двойной щелчок выделяет следующий текст
Я использую несколько SVG-файлов в своем приложении React и импортирую их как ReactComponents:
import { ReactComponent as InfoIcon } из "../../resources/svg/icons/basic/info-icon.svg"; тогда я буду использовать его в своем компоненте следующим образом:
Моя проблема в том, что всякий раз, когда я дважды щелкаю любой SVG в приложении, он выделяет текст в следующем ближайшем элементе дерева html, содержащем текст. Обычно это родственный элемент, но если нет родственных элементов с текстом, он просто переходит к родственному элементу родителя и т. д.
Я попытался предотвратитьDefault и stopPropgation в обработчиках событий onClick, но это не повлияло на подсветку текста.
Я также заметил, что это происходит на большинстве сайтов, где изображение не взаимодействует, и это, похоже, специфичная для Chrome функция (в Firefox этого не происходит). Есть ли способ предотвратить такое поведение, кроме использования CSS user-select: none?
Я использую несколько SVG-файлов в своем приложении React и импортирую их как ReactComponents:
import { ReactComponent as InfoIcon } из "../../resources/svg/icons/basic/info-icon.svg"; тогда я буду использовать его в своем компоненте следующим образом:
Моя проблема в том, что всякий раз, когда я дважды щелкаю любой SVG в приложении, он выделяет текст в следующем ближайшем элементе дерева html, содержащем текст. Обычно это родственный элемент, но если нет родственных элементов с текстом, он просто переходит к родственному элементу родителя и т. д.
Я попытался предотвратитьDefault и stopPropgation в обработчиках событий onClick, но это не повлияло на подсветку текста.
Я также заметил, что это происходит на большинстве сайтов, где изображение не взаимодействует, и это, похоже, специфичная для Chrome функция (в Firefox этого не происходит). Есть ли способ предотвратить такое поведение, кроме использования CSS user-select: none?
Мобильная версия