Не могу понять принцип работы в react с setInterval & setTimeout?

Question

[RomanSS]

Помогите разобраться и понять как работает в реакте setInterval или это особенности javascript, не могу понять.
Когда загружен компонент я вещаю в "componentDidMount" setInterval с выполнением запросов на сервер, запросы уходят, все отлично.

Если этот компонент не активен (размонтировали), запросы прекращаются, т.е. setInterval перестаёт работать, хотя я его не убивал функцией clearInterval, напрашивается вопрос почему? (хотя вроде бы логично, убили компонент, убился и setInterval), но тут встает другой вопрос, он не убивается, а просто останавилвается, потому что когда я вновь активирую этот компонент, у меня уже начинают работать одновременно два setInterval (первый от перового отображения, второй от второго) т.е. компонент хранит информацию по нему, но как он его останавливает тогда, при размонтировании компонента, запросы к серверу ведь прекращаются, значит как-то отключился setInterval?

Ну и дополнительный вопрос, можно ли как-то в реакте убить разом в компоненте все запущенные в нём setInterval, или нужно будет хранить например в массиве ид запущенных интервалов?

Answer 1

[Anton Bobylev]

Интервалы автоматически не могут остановиться, если не был сохранен их идентификатор и явно не был вызван clearInterval.

В реакте - тоже самое. Даже если компонент стал неактивным интервалы будут выполняться. Поэтому если не хотите утечек - сохраняйте идентификаторы и явно вызывайте clearInterval в componentWillUnmount.

Вот посмотрите пример: https://jsbin.com/zefopuw В консоли будет видно, что несмотря на то, что компоненты были удалены - интервалы все еще работают.

Comments

[RomanSS]

перепровил, еще раз свой код, действительно запросы всё же уходят. Оказывается пока исправлял другой косяк уже в компоненте поправил удаление интервала, и забыл про это