Блог

У меня возникли некоторые проблемы с использованием библиотеки React-Beautiful-Dnd для создания системы перетаскивания в моем веб-приложении. Я следовал руководству, и все прошло хорошо, но сейчас я пытаюсь использовать его в своем приложении, где мне нужно иметь возможность добавлять и удалять перетаскиваемые объекты по запросу пользователя с помощью кнопки добавления / удаления. Проблема в том, что приложение ничего не перерисовывает, пока я не попытаюсь переместить один из старых перетаскиваемых файлов.

Кроме того, по какой-то причине после вызова функции onDragEnd приложение не находит идентификатор перетаскиваемого объекта, который был перемещен в этот момент. Я не знаю, что для этого делать. Я написал пример кода проблемы в CodeSandbox: https://codesandbox.io/s/zealous-blackwell-f3mmh . Если бы кто-нибудь мог мне помочь, я был бы очень благодарен.

Похоже, что приложение не перезаписывается при изменении состояния.

Одно из решений — обмануть react. Смотрите мое решение https://codesandbox.io/s/keen-rubin-kxj6o?file=/src/App.js

Использование forceUpdate

У меня тоже была эта проблема несколько раз. Попробуйте заменить все строки (по крайней мере, строку 28), где вы написали

 let newItems = items;
 

с

 let newItems = [...items];
 

Проблема в том, что он плохо работает, если вы пытаетесь изменить само состояние, но если вы создаете копию массива, он работает отлично (по крайней мере, для меня)