vuejs2 - 如何在没有 webpack 的情况下使用 Vue.Draggable CDN?

标签 vuejs2 vue-component vuedraggable

我是 Vue 的新手。我客户的 CodeIgniter 网站上的其中一个页面 (salesview) 需要使用 Vue,因此我将其包含在
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
我在一个名为 salesview.js 的文件中声明了 Vue 及其组件。 .现在,我需要使用 Vue.Draggable成分。我将它添加到页面中,如下所示:

<script src="//cdn.jsdelivr.net/npm/sortablejs@1.8.4/Sortable.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/Vue.Draggable/2.20.0/vuedraggable.umd.min.js"></script>

由于我没有使用 webpack,我该如何使用这个组件?

最佳答案

我通过从 window 对象访问 vuedraggable 并将其添加到组件选项中解决了我的问题,如下所示:

var vm = new Vue({
    el: '#app',
  components: {
    'sv-lead-column': svLeadColumn,
    'sv-customer-column': svCustomerColumn,
    draggable: window['vuedraggable']
  },
  ...
})

关于vuejs2 - 如何在没有 webpack 的情况下使用 Vue.Draggable CDN?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61586238/

相关文章:

vue.js - Vue-Draggable 在 b-modal 上无法正常工作

javascript - 模态窗口后面的黑白叠加

javascript - 如何使用 Vue.js 在单击时更新特定的子元素?

vuejs3 - 如何将行从一个数据表拖动到另一个数据表? (PrimeVue)

typescript - 如何使用响应式(Reactive)方法设置 Vue 3 Composition API(Typescript)待办事项列表应用程序

javascript - vuejs刷新后无法加载二级路由页面

vue.js - Vue.Draggable 能否与 Vuetify v-data-table 一起使用并允许使用表 v-slot :item. <name>?

validation - vee 验证 : Required only if a condition is met

vuejs2 - Nuxt 自定义模块 Hook 未调用

javascript - Vue.js:如何在单个文件组件中指定 Prop ?