Обнаружение, когда выпадает открыт или закрыт ⇐ Javascript

[Anonymous]

Я должен иметь возможность обнаружить, когда выпадает выпадающая часть потока и закрывается от его родительского компонента. При открытии мне нужно позвонить в конечную точку API и обновить состояние одного из его элементов, но только при открытии. Причиной этого является то, что у меня есть дюжина этих раскрывающихся департаментов, присутствующих на странице одновременно, выполняя эти функции обновления одновременно, наносят ущерб производительности. < /P>
Вот минимальный пример компонента. Заполнение было бы асинхронным вызовом на бэкэнд. Это работает и делает то, что я хочу, но это работает для каждого элемента для каждого компонента , отображаемого на экране. Это много обработки. Я хочу, чтобы это было лениво только для предметов в открытом выпадении.

Код: Выделить всё

export default function RowOptions() {
return (


Actions
{items.map(item => (
{populate()}
))}


)
}

Я надеялся, что у него будет свойство onopen или onclose , к которому я мог бы зацепить, но это не так. Есть ли обертка, которую я могу использовать, чтобы получить эту функциональность? Я попытался использовать рефери в трек, когда он виден, но это работало только частично.export default function RowOptions() {
const [isOpen, setIsOpen] = useState(false);
const myRef = useRef(null);

return (

}>

Actions
{items.map(item => (
{populate()}
))}


)
}
< /code>
Это работало частично. Я мог бы по существу отслеживать изменение состояния, если кнопка нажала ... но это осенью, как только вы нажали на предмет или выпуск от выпадающего списка. Тогда государство станет все грязно. Так что этот подход явно был не лучшим вариантом. Я не уверен, что это лучший подход, особенно для React, но это то, над чем я сейчас работаю.

Подробнее здесь: https://stackoverflow.com/questions/796 ... -or-closed