Сворачивать элементы в спойлер, когда они выходят за ширину экрана на всех разрешениях
Есть блок с элементами, условно с тегами, количество этих элементов может постоянно реактивно меняться, так как эти теги появляются если пользователь выбрал фильтры. Мне необходимо сделать так, чтобы как только добавленный элемент стал не помещаться в ширину окна текущего разрешения, он прятался в спойлер и появлялась кнопка "ещё". Все элементы до этой кнопки остаются на своих местах, а новые прячутся в спойлер, если не помещаются. Ширина экрана соответственно может быть любой, у элементов также нет жесткой ширины, но они не могут быть больше 220px.
Очень жду любые идеи как такое реализовать и в каком направлении двигаться
Ответы (1 шт):
Я бы предложил вам использовать IntersectionObserver для реализации проверки, собственно, нахождения элемента в нужной вам области, а для показа разного контента использовать условную отрисовку (v-if etc.) отталкиваясь от IntersectionObserver.