Drag&Drop и стиль background
Создаю проект toDo c возможностью драга элементов списка. Для того чтобы всё было красиво сделал так, чтобы бэкграунд при нахождении drag-элемента над другим элементом подсвечивался синим background'ом. Проблема заключается в том, что все внутренние элементы тоже получили это свойство и когда я навожу на блок текста в todo'шке он подсвечивается отдельно от всей todo'шки. Скриншот:
Я ожидаю от данного действия полной подсветки todo.
Далее код хендлера покраски:
const onDragOverHandler: IOnDragEvents = (e) => {
e.preventDefault();
e.target.style.background = 'var(--blue) ';
};Ответы (1 шт):
если я всё правильно понял, то ты повесил этот обработчик на всю карточку, но цвет меняется у текста, потому что ты используешь у event свойство target(тот элемент, который и вызвал само событие), а тебе нужен текущий элемент(карточка), на который это событие "всплыло", поэтому просто используй currentTarget:
const onDragOverHandler: IOnDragEvents = (e) => {
e.preventDefault();
e.currentTarget.style.background = 'var(--blue) ';
};