angular因為是雙向數(shù)據(jù)流，處理拖拽后的數(shù)據(jù)變化比較方便，用過原生的html5拖放(drag和drop)、angular的cdk drag-drop以及第三方dragula庫。
由于項目技術棧從angular重構為react，基于ng2-dragula的多容器(容器之間會有嵌套)拖拽方案照搬過來以后出現(xiàn)了不少問題，比如拖拽后dom嵌套有問題，拿不到拖拽后的數(shù)據(jù)，第一想法是通過dom獲取拖拽后的數(shù)據(jù)，然后通過setState重新渲染界面。但拖拽后的dom仍然存在，會出現(xiàn)界面重復的現(xiàn)象。因此最后的方案是在通過dom獲取到數(shù)據(jù)以后通過drake.cancel(true)取消dom的拖拽。最后不要忘了在每次setState的回調(diào)中更新容器container。