Trouble getting vue-dragula to work with quasar 0.14

[dsl101]

I’m really struggling to get vue-dragula to work with q-list containing q-item's. The ‘extra’ item created by vue-dragula whilst dragging (supposed to be an indication of the current drop target) does not appear in the list, but off the bottom of the screen (I’m using q-layout along with a toolbar and a couple of other divs).

Before I go stripping things out, has anyone got this to work properly with a q-list? Or is there a better library to use for a sortable list which plays more nicely with Quasar?

[dsl101]

I also tried vuedraggable - it’s better in that its interaction with q-list works, but it defeats the highlight class, so still not right. @rstoenescu I know you were resistant to this being a part of quasar, but I suspect all the other libraries will show undesirable behaviour like this, since they are all interacting so closely with the DOM.

[rstoenescu]

@dsl the current work pile is huge, but will add this to the todo list.

[dsl101]

I can imagine :). I know it’s probably not top priority, but the alternatives are definitely sub-optimal.

[rstoenescu]

Will take into consideration and probably open up a new thread before I start implementing it so we can all brainstorm on the needed functionality.

[pmooredesigner]

i can’t get any sortable implementation to work with Quasar yet. Assuming I was doing things correctly, is there a particular reason this might be the case? I don’t care to post code and go in depth at the moment. Just curious if there was an obvious reason that I overlooked.

[pmooredesigner]

I had been doing things correctly regarding Vue.Draggable, but I was working inside the left layout slot, and the side slots are apparently the only place it doesn’t work (at least by default). It has worked everywhere else I’ve tried it. Not sure why yet, but figured I’d post this in case anyone else had this issue.

[wux]

Will the up coming 0.15 release solve this problem? The Vue.Draggable is not working when the draggable div contains a textarea input (<q-input type=“textarea”>), though it works with a normal text field.