vue-sortable icon indicating copy to clipboard operation
vue-sortable copied to clipboard

has this plugin any incompatibility with vue 2.0?

Open arquadrado opened this issue 8 years ago • 16 comments

I'm trying to use this plugin with vue 2.0 and I'm always getting the following error 'Uncaught Sortable: el must be HTMLElement, and not [object Undefined]'

Any help would be most appreciated. Thanks

arquadrado avatar Sep 12 '16 14:09 arquadrado

I haven't done any testing with 2.0, but I know that directives were changed significantly. Sounds like the last release candidate is out, so I'll get this updated in the near future.

sagalbot avatar Sep 29 '16 20:09 sagalbot

I'm using your library in a project that I'm upgrading to 2.0. I was able to replace the directive with this:

    Vue.directive('sortable', {
      inserted: function (el, binding) {
        var sortable = new Sortable(el, binding.value || {});
      }
    });

You'll notice that I removed some of the code around saving references to the sortable. As directives no longer have an instance associated with them, I don't know that it's possible to restore this functionality. However, I wasn't using it so it wasn't a problem.

jasonlfunk avatar Oct 04 '16 06:10 jasonlfunk

hi there :) finally i managed to get sortable working with vue 2: http://codepen.io/kminek/pen/pEdmoo - maybe it will help to upgrade this plugin :)

kminek avatar Oct 04 '16 23:10 kminek

@kminek your fix worked for me. Thank you.

alan-andrade avatar Dec 07 '16 04:12 alan-andrade

Can this fix be pushed up to npm?

websanova avatar Jan 07 '17 18:01 websanova

Hey guys, the code is so simple, just put this shit into your project and get it work for Vue 2:

import Vue from 'vue'
import Sortable from 'sortablejs'

Vue.directive('sortable', {
  inserted: function (el, binding) {
    new Sortable(el, binding.value || {})
  }
})

Why bother to introduce another lib? Right?

And remember to add keys for your items: https://github.com/vuejs/vue/issues/4085#issuecomment-257673656

Full example by @Ivannnnn

https://jsfiddle.net/1khq32ed/10/

FrankFang avatar Jan 15 '17 17:01 FrankFang

Full example: https://jsfiddle.net/1khq32ed/10/

Ivannnnn avatar Feb 01 '17 17:02 Ivannnnn

Any of you have the following problem? __WEBPACK_IMPORTED_MODULE_1_vue_sortable___default.a is not a constructor

ItsRD avatar Feb 22 '17 15:02 ItsRD

@ItsRD I'm also experiencing this problem. Were you able to find a solution?

fernandomm avatar Mar 08 '17 03:03 fernandomm

@fernandomm Nope, I'm still waiting for a solution..

ItsRD avatar Mar 08 '17 07:03 ItsRD

@ItsRD I found the solution. I was importing vue-sortable but, as per https://github.com/sagalbot/vue-sortable/issues/10#issuecomment-272709457, only sortablejs should be imported.

fernandomm avatar Mar 08 '17 12:03 fernandomm

@fernandomm aah thanks! I'll look at that! :)

ItsRD avatar Mar 08 '17 12:03 ItsRD

@fernandomm just took a look at it, works perfectly! Thanks! 👍

ItsRD avatar Mar 22 '17 22:03 ItsRD

Can someone explain me why solution given by FrankFang does not work for me and console.log(Sortable) returns undefined and when I change import to

import * as Sortable from 'sortablejs/Sortable.js'

then it works?

grzegorztomasiak avatar Jun 28 '17 14:06 grzegorztomasiak

Yeap! it's working now

abdessamadely avatar Dec 06 '18 11:12 abdessamadely

Works like Magic! Thank you for the solution

432player avatar Jan 05 '21 09:01 432player