Vue.js + jQuery UI可拖动
Vue.js + jQuery UI可拖动
提问于 2016-02-06 06:37:22
为了使组件可拖动，我编写了一个新的vue指令，如下所示
Vue.directive('drag', {
bind: function () {
$(this.el).draggable();
}
});我让它们在bind上可拖拽。这在检查器中工作得很好，如果我拖动卡片，我会看到top和left是如何变化的，但它在物理上没有变化！我的意思是这些卡片会留在他们的地方。Screenshot of the inspector. Looks fine.
我已经在helper: "clone"上试过了，这很有效(我可以看到克隆被拖走了)。但这不是我想要的。
如果我按类选择器选择每一张牌，如下所示：
$(".card").draggable();它也工作得很好，但我不想在添加了一个新的元素后再次使所有其他元素都可拖动。
我做错了什么？
回答 3
Stack Overflow用户
发布于 2016-02-12 02:24:34
为了使用jquery ui函数，需要用nextTick调用它。如下所示：
Vue.nextTick(function () {
$('.card').draggable();
});Stack Overflow用户
发布于 2016-04-20 00:25:08
你不需要使用nextTick。由于问题在于是在元素加载之前调用的，所以您可以像其他所有使用jQuery的人一样使用jQuery的.ready方法
Vue.directive('draggable', {
bind: function () {
var self = this
$(document).ready(function () {
$(self.el).draggable()
})
}
})Stack Overflow用户
发布于 2017-12-13 19:15:21
来自https://vuejs.org/v2/api/#mounted
mounted: function () {
this.$nextTick(function () {
// Code that will run only after the entire view has been rendered
$('.card').draggable();
})
}顺便说一下，$(this.el).draggable()不能工作，我不知道为什么
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/35234754
复制相关文章
相似问题
腾讯云开发者
