vuejs2 - vue-draggable 无法禁用

标签 vuejs2 draggable sortablejs vuedraggable vue.draggable

我编写了一个在整个应用程序中共享的组件,在某些地方我需要拖动/排序,而有些地方不希望它在那里。我通过了 prop到我名为 disableDraggable 的组件并基于它应该禁用,不幸的是它没有做任何事情,我如何禁用可拖动?
我应该注意到我尝试了选项对象语法和一个简单的 :disable ,这里是相关的代码:

 <draggable v-model="copyOfQuestions" @end="$emit('updateQuestionsOrder', copyOfQuestions)" :options="{disable : disableDraggable}">  
// or :disable="disableDraggable"
      <v-card flat class="list_outer_block" v-for="q in questions" :key="q.question_id">
        <v-card-text class="pa-0">

          <v-layout justify-start align-center>
            <v-flex initial-xs px-2 py-3 class="handle minwdth-0" :title="$t('general.drag_for_reorder')">
              <v-icon class="text--secondary  text--lighten-3">$vuetify.icons.drag_indicator</v-icon>
            </v-flex>
    ....
        props: ['questions', 'disableDraggable'],

如何禁用可拖动功能?

我应该注意到 vue-draggable (我正在使用的)据说与 SortableJs 具有相同的 api

最佳答案

应该是 :禁用 而不是 :禁用 .

 <draggable v-model="copyOfQuestions" @end="$emit('updateQuestionsOrder', copyOfQuestions)" :options="{disabled : disableDraggable}">  

引用:
https://github.com/SortableJS/Vue.Draggable/blob/17bdd4b8b2ab4f4df45dd76edf1afec864ec0936/example/debug-components/slot-example.vue

关于vuejs2 - vue-draggable 无法禁用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57179289/

相关文章:

vue.js - 为什么 react 变量在未分配给 v-model 时会发生变化

vue.js - 来自@vue/test-utils的mount()和shallowMount()抛出TypeError : Cannot read property 'components' of undefined

javascript - 如何让我的 JQueryUI 可拖动元素 float 到另一个溢出元素中?

Angular 5 - 不执行构造函数和 ngOnInit

vue.js - Vuetify v-data-table 拖放

javascript - 使用 JavaScript 在 SortableJS 可排序列表上模拟拖放

javascript - 父插槽中的可重用组件访问子方法

javascript - 在哪里放置全局帮助 js 函数

javascript - 尝试将 Shopify 的 Draggable 模块与 svelte 一起使用,但没有成功

jquery - 如果在此 div 之外且在其他可拖动项内部,则可拖动恢复(同时使用无效和有效恢复选项)