Изменение порядка элементов списка в React-компонентах

[@sergeylv1411]

Автору огромное спасибо, очень богатая библиотека, не перестает меня удивлять!

[@АрчибальтГугенов]

Когда появляется новая задача, которую нужно реализовать, сразу иду к вам на канал, чтобы узнать, как это сделать. Сегодня снова повезло.

[@odinokun]

Спасибо. Ваше видео помогло. Видео с анимациями в React никогда не будут лишними =)

[@azizbekkomilov3589]

Супер очень полезный видео спасибо огромное!! )) Можите сделать видео на эту тему толька с массовыми картинками!

[@CharlyChaplin100]

Спасибо за хорошее и понятное объяснение! Полезная информация!

[@АнатолийГорбов-о1ь]

Очень информативные видео, спасибо! Михаил, а не планируете выпустить видео по библиотеке react-beautiful-dnd или React-DnD? было бы интересно посмотреть про них, может какие-то необычные кейсы, да и в целом обзор библиотеки был бы супер!

[@Sergey_D.]

Супер! То, что надо! Спасибо

[@andreynasuto9734]

спасибо огромное! провозился с библиотекой DND и понял что у нее есть проблемки с мобильными устройствами, а у этой вроде все норм. Беру на вооружение.

[@HumoyunAhmedov-g9r]

Спасибо вам!

[@vasilymedvedev3077]

Очень просто и круто

[@BorysOliinyk]

Очень полезно, спасибо большое.

[@ЕвгенийТяка-ч4х]

Очень полезно, спасибо!

[@vasilemidrigan50]

Thank you very much! It helped me a lot!

[@glebkraitcer3109]

Классно. Спасибо за обзор. Михаил, а возможно подобную красоту сделать с react DnD или проще сразу на Framer motion все делать?

[@mishanep]

У меня не было опыта работы с React DnD.

[@ДенисБельский-й9г]

Интересно, все по делу, без воды. Можете сделать пример работы с React Select, если Вы им пользуетесь

[@mishanep]

У меня на канале есть мини проект со странами, там есть пример использования React Select

[@ДенисБельский-й9г]

@@mishanep спасибо, нашел

[@sergey_zatsepin]

Ну не плавненько item сворачивается при удалении, не надо тут заливать, с прыжком(bounce) в конце. Правда это похоже просто из-за типа перехода. Вообще надо сказать, что либа хоть и эффектная, но глючная ппц и в частности с reorder интуитивно неясная в опр. ситуа. Здесь ведущий юзает простенький пример, но если скажем нужно засинхронить несколько вложенных лэйаутов(div > ul > li), то скорее всего придётся пошаманить. Плюс, есть проблемы со строгим режимом Реакта, пусть даже это не оч критично. И есть проблема с билд сборкой в Vite для Reorder как раз(f-m 7.6.19). Хз мб даже напишу орлам на разрабах. Хотя у них там и так ~230 ишьюс =)

[@КириллМолев-д1м]

Вопрос к знатокам, если я вместо useState из redux беру items через useSelector, какую функцию запихивать в onReorder?

[@killd0z3r]

По идее, Функцию редюсера, который должен быть у тебя в слайсе, через диспатч. Он должен повторять логику onreorder

[@alimax29]

Огромное спасибо!!!!!

[@evloev4821]

автор лучший из всех кого я смотрел) я еще до конца не досмотрел, но спрошу все же, при помощи frame motion можно сделать аull page scroll ?

[@mishanep]

Что конкретно вы хотите сделать?

[@TheS68123]

а можно в этой библиотеке не только в одном направление меняться а также одновременно в двух? в плоскости x и y

[@RusDevel]

А как закрепить конкретную тудушку, чтоб ее нельзя было перетаскивать?

[@plajboi3608]

Спасибо за замечательный контент! А как работать с redux? Просто TS запрещает передавать в onReorder НЕ useState. Ну даже если я получу тудушки с useSelector, а потом засуну их в useState и буду useEffect(ом) следить за обновлениями селектора, появляются баги, когда я изменяю состояние какой-либо тудушки. "передрагЭндДропываю", то есть меняю местами, и когда удаляю тудушку или меняю completed например, то порядок тудушек становится каким он и был изначально.

[@TheEmeric]

нашел решение?

[@egornikolaev3038]

Скажи пожалуйста, мне дали тестовое, в котором нужно реализовать функционал перетаскивания с помощью любой библиотеки для drag and drop. Можно ли сказать, что эта библиотека подходит под эту категорию? Дело в том, что в тестовом ограниченный список библиотек, которые разрешено использовать

[@mishanep]

Framer motion не является библиотекой именно для drag and drop, но с ее помощью данная процедура тоже возможно. Узкоспециализированные библиотеки для этих целей я не использовал.

[@АрчибальтГугенов]

Reorder можно использовать со styled-components? Что то не могу достичь корректной работы

[@mishanep]

Не вижу препятствий

[@АрчибальтГугенов]

@@mishanep заработало! Подскажите, пожалуйста в двух - трех словах. Есть список и drag and drop по этому уроку. Но у списка есть сортировка (активный/не активный/все). Через .map() проходит уже сортированный список. Но если менять порядок элементов в сортированном списке, то в state попадает лишь элементы, попадающие под запросы сортировки, а все остальное затирается. Можно ли совместить drag and drop и сортировку? Как это сделать? Или может позволить перемещать элементы списка только, когда доступен весь список (сортировка - "Все")?

[@dimondmarcker3179]

Михаил, у меня вопрос: это нормально что мы так часто копируем и вставляем эти параметры анимации? или можно как то это сделать элегантнее?

[@sergeys4732]

Вопрос, ее в проде если юзать, то надо платную версию покупать?

[@mishanep]

Моя компания не платила)) лицензию не читал. Вроде опен сорс обычный.

[@NovikovEugene84]

Халява!

[@Гилфойл-т4я]

AAaaaaahh nice

[@ПавелЖивченко-я4ч]

топ