Правильно ли вешать обработчик события на document.body?

Question

gleendo @evgeniy8705

Повелитель вселенной

JavaScript

Правильно ли вешать обработчик события на document.body?

Исходный код на codepen
Суть непонимания на 23 строке:

document.body.addEventListener("update-form", () => {
	this.load();
	this.userForm.destroy();
}, false);

Данные формы изменяются, и после нажатия Submit, список должен перерисовываться. Правильно ли в данном случае вешать слушателя обновления формы на document.body? На что его лучше поставить.

Вопрос задан более трёх лет назад
1045 просмотров

2 комментария

Подписаться 2 Оценить 2 комментария

Пригласить эксперта

Ответы на вопрос 2

2 комментария

3 комментария

gleendo @evgeniy8705 Автор вопроса

Stalker_RED На счет делегирования я знаю, мне не ясно к чему вешать обработчик например если не использовать делегирование...
И нашел еще одну проблему. Почему то после изменения данных, форма не удаляется, а просто сжимается до нулевой высоты, хотя использую this.form.remove()

Написано более трёх лет назад
Stalker_RED @Stalker_RED

iamevg_: я вот сейчас открыл codepen и понажимал. и форма таки удаляется, остается только <div class="user-form">

Написано более трёх лет назад
gleendo @evgeniy8705 Автор вопроса

Stalker_RED: Я на счет удаления формы пофиксил, теперь все нормально работает. Вроде как "приложение" готово, но вот такое чувство что если завтра попробую сам опять сделать подобное, то ничего не выйдет.
Я уже овер много изучаю js, но вот архитектура приложений меня всегда пугает. Я вообще не понимаю как ее организовывать. Наговнокодить все в императивно декларативном стиле я могу, а вот best practices я не знаю в этой теме. Сегодня вот еще узнал про компонентный подход. Но все равно не до конца все понятно, как эти компоненты разрабатывать, как организовывать общение между ними и т.д. С таким то "приложением" ели как справился и то половина по видео, да и то кажется что моя половина гавно.

PS. На счет обработчика...Кроме как на document.body ни на что не вешается, хз почему.

Написано более трёх лет назад

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации

Похожие вопросы

JavaScript

+2 ещё

Простой
Вся секция заежает за header?
- 1 подписчик
- 7 часов назад
- 24 просмотра
0

ответов
JavaScript

Простой
По какой логике bind принимает только первый контекст?
- 1 подписчик
- 12 часов назад
- 84 просмотра
2

ответа
JavaScript

+2 ещё

Средний
Возможно ли расположить или чтобы блок div мог заходить в прозрачный фон png фота?
- 1 подписчик
- 14 часов назад
- 26 просмотров
1

ответ
JavaScript

+3 ещё

Средний
Как сделать выборку mongo?
- 1 подписчик
- 14 часов назад
- 30 просмотров
0

ответов
JavaScript

Средний
Запись в cookie или localStorage только при открытии страницы?
- 1 подписчик
- 15 часов назад
- 38 просмотров
3

ответа
JavaScript

+2 ещё

Средний
Правильно ли настроен webpack.config для PWA приложения?
- 1 подписчик
- 16 часов назад
- 27 просмотров
0

ответов
JavaScript

+3 ещё

Простой
Почему приходят пустые данные с формы на почту?
- 1 подписчик
- 20 часов назад
- 55 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Как при помощи js создать поле дополнительных ингридиентов?
- 1 подписчик
- вчера
- 79 просмотров
0

ответов
JavaScript

+1 ещё

Средний
Как в Next.js закешировать изображение без build?
- 1 подписчик
- вчера
- 36 просмотров
0

ответов
JavaScript

Простой
Как поставить лайк на все комментарии видео в тикток?
- 1 подписчик
- вчера
- 145 просмотров
2

ответа
Показать ещё Загружается…

JavaScript разработчик

SummerWeb • Ярославль

от 100 000 до 140 000 ₽

JavaScript разработчик

вАйТи

от 5 000 до 25 000 ₽

Middle JavaScript Developer

AppsTrain.io

от 80 000 до 180 000 ₽

Подобрать картинки для каталога

27 апр. 2024, в 06:40

2000 руб./за проект

Подключить сервер к сети

27 апр. 2024, в 02:39

1500 руб./за проект

Необходимо сверстать приложение согласно макету Figma используя React

26 апр. 2024, в 22:22

1500 руб./за проект

В связи с чем у вас возник вопрос? У вас возникают проблемы при использовании описанной схемы?
Никита Полевой: Я просто не шарю в компонентной разработке. Пол приложения делали по видео, остальную часть нужно было сделать самому. Вроде как сделал. Но вот не совсем понятно куда же этот обработчик вешать. Повесил на весь документ можно сказать, но хз, правильно ли это. В этом же приложении, если нажать на user, то сработает событие user-select. Данное событие вешается на на список пользователей. Как только событие сработает, то рендерится форма.

Answer 1 · 2017-07-21 21:37:47

Владимир @djQuery

"Кодируем помаленьку" ("Сказка о Тройке")))

Почему бы не поставить на ближайший wrapper?

Ответ написан более трёх лет назад

2 комментария

Answer 2 · 2017-07-21 21:44:19

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

Правильно ли вешать обработчик события на document.body?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт