search

taniarascia / comments

Comments
7 stars 0 forks source link

simplifying-drag-and-drop/ #129

Open utterances-bot opened 1 year ago

utterances-bot commented 1 year ago

Simplifying Drag and Drop (Lists and Nested Lists) | Tania Rascia

I always forget how to use any drag and drop library until I have to use it again. Currently, the one I've been working with is , the…

https://www.taniarascia.com/simplifying-drag-and-drop/

ydax commented 1 year ago

This was an elegant and helpful tutorial. Thanks!

KamranMK commented 1 year ago

Very nice and super useful tutorial! I tried in the demo to add the nested items further down the tree, so essentially nesting further, is it possible to extend the article/codebase to include this as well?

dubbajubba commented 1 year ago

Thank you for this post! Very helpful! It has made me understand the react-beautiful-dnd library much better.

I have a quick question. I'm building a nested list and I am getting a type error with these lines,

destinationOrder[removed] = sourceOrder[removed]
delete sourceOrder[removed]

I'm trying to understand what these lines do. It seems redundant. I would think the lines before are already accomplishing what we want to accomplish. Maybe I'm misunderstanding, some clarification would be great! Thanks!

// I would think these lines
const [removed] = sourceOrder.splice(source.index, 1)
destinationOrder.splice(destination.index, 0, removed)

// Do the same as these lines
destinationOrder[removed] = sourceOrder[removed]
delete sourceOrder[removed]
montassar-vaionex commented 1 year ago

how i can apply this example for data with complexe nested list (4 levels) ? @taniarascia