Ich hoffe, dass ich einige APIs von JQuery UI verwendet habe, wie zum Beispiel draggable(). aber es funktioniert nicht. Ich fand die mögliche Ursache ist, dass es Null-Objekt für $ .ui in Vue-Aufruf gibt. Möchtest du bitte einige Erfahrungen dafür teilen?Der Vue konnte die API von JQuery UI nicht aufrufen.
Ich habe Jquery UI und Vue js ohne Kompatibilitätsprobleme verwendet. Wenn Sie eine Komponente ziehbar machen möchten, müssen Sie alle Handler anhängen nach Vue hat das DOM aktualisiert.
Das HTML-Element einer Komponente kann über die Eigenschaft $el erreicht werden. Von der können wir sehen, dass $el während der Lebenszyklus-Hook ready verfügbar sein wird.
Mit diesem Wissen können wir eine Komponente draggable() mit dem folgenden Code ein:
Vue.component('draggable-widget', {
template: '#draggable-widget',
ready: function() {
$(this.$el).draggable();
}
});
ist hier ein JSFiddle es in Aktion zeigt.
Ich benutze Vue.nextTick (function() {} ... es funktioniert auch, lass mich dein versuchen Übrigens, ich dachte, deine Antwort sei richtig! – xinshouke
Wenn du die Komponente aus der übergeordneten Vue-Instanz ziehst oder aus einer Elternkomponente, dann ist wahrscheinlich die '$ nextTick'-Funktion notwendig Funktioniert, wenn die Komponente * selbst * ziehbar macht. Froh, dass es funktioniert hat! – asemahle
Wenn Sie Webpack verwenden, müssen Sie möglicherweise das webpack.ProvidePlugin für jQuery verwenden. siehe http://stackoverflow.com/questions/28969861/managing-jquery-plugin-dependency-in-webpack – vbranden
Können Sie Ihr Problem genauer erklären? Hier ist eine jsfiddle, die ziehbare() auf eine vue js Komponente anwendet: https://jsfiddle.net/asemahle/dj8uujky/ – asemahle