Drag And Drop
-
What a hell, this frame is amazing!!! but, the draggable and dropable component is missing!!
pls!!! -
I heard rumor someone is working on it as an App ExtensionâŚ
-
@Hawkeye64 said in Drag And Drop:
I heard rumor someone is working on it as an App ExtensionâŚ
Hope to hear good news about this soon
-
I believe Lucas Ban (@mesqueeb) is doing this. Iâll have to get in touch with him to see how it is going.
-
@Hawkeye64 that would be great
-
-
This should really be part of Quasar I feel and not an extension. I am going to start bodging the drag and drop today into qTable to start with and then qTree. And many will end up doing the same because sooner or later you will need it. How else are you supposed to organise a tree for example ? There is not many other ways to do it.
-
Agreed⌠it would be nice if Drag and Drop functionality was built into our components. I know most developers are going mobile but Quasar could really be a leader in the desktop space too.
-
Adding this to quasar will be nice, but could take same time to add it to all components. I just added vue-draggable to my project and it works as a charm. You can link it to all sorts of components. Currently I have it in a qlist to determine my sort sequence
-
Upvote for built-in draggable features, especially for lists and tables
-
@DDP said in Drag And Drop:
Upvote for built-in draggable features, especially for lists and tables
and q-tree and q-chipsâŚ
-
Currently not working on MacOS Safari so ⌠not a real option yet but a great start
https://quasar-app-extension-draggable.netlify.com/#/ -
Hi everyone. I made the draggable extension for a project of mine about a year ago.
The downsides of my extension were:
- I only ever required being able to drag rows. Not âany component to any other locationâ.
- I never found out why it didnât work on macOS
- I learned a lot since I first made it, and would do it all different nowâŚ
The project is still a side project, and I plan to start working on it again somewhere this year. At that time I was planning to rewrite it from scratch with the new Vue 3 composition api; better separation of code; TypeScript.
But I think until that time many more devs need drag and drop for a variety of reasons, so I wanted to give some advice:
- Whenever you start building it, use the quasar-starter-kit-ui itâs really good for modular components complete with a demo project for you to HMR test your standalone component youâre building.
- When you start building the ui component, you can try to get ppl involved via discord so the community could work together.
- Youâll most likely track the mouse position to calculate the css of the element youâre dragging, to calculate where to drop the element and how the UI should look, Iâd suggest try using the on-mouseover directive.
- Try to immediately set up a demo with numerous test items to drag. To see if itâs performant. I had a problem where it became slow after 300+ items, but it was too late because I always tested with about 10 items.
-
Just FYI,
I recently found this very promising vue library to add drag and drop functionality:
https://github.com/kutlugsahin/smooth-dndIt seems very easy and powerful.
Iâm trying to play around with it now. -
Currently WIP - https://github.com/pratik227/quasar-qgrid
-
@turigeza Any success on your work?
-
@Serhioromano In short no. : )
The table I have rewritten from scratch there are too many things missing for me or was at the time. (But I am not using it after all because I am not using tables at all with my current project)With the tree I have tried to recreate the look of a tree with the https://quasar.dev/vue-components/expansion-item. And it sort of worked : ) But it was way too slow ⌠So I am not using that either. I still have to solve this issue (I am working on something else just now)
I ended up creating a feature request because I thought it would benefit everyone:
https://github.com/quasarframework/quasar/issues/5890
