Как можно отследить, что часть компонента или он весь отображается за пределами видимой пользователем области?

Question

[Guzh]

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

Comments

[Yustas Alexu]

Код в студию

[ой всё]

посмотреть?

Answer 1

[AlexKeller]

На componentDidMount получить его позицию через Element.getBoundingClientRect и посмотреть свойство right. Если оно больше window.innerWidth, то сдвинуть компонент влево, чтобы он весь влез в видимую область