Alfred-Skyblue
commented
2 months ago <body>
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-draggable-plus@0.4.0/dist/vue-draggable-plus.iife.min.js"></script>
<div id="app">
<div ref="elRef">
<div class="item" v-for="item in items" :key="item.id">
{{item.name}}
</div>
</div>
</div>
<script>
const { VueDraggable, useDraggable } = VueDraggablePlus
Vue.createApp({
components: { VueDraggable },
setup() {
const items = Vue.ref([
{
id: 1,
name: 'item1'
},
{
id: 2,
name: 'item2'
},
{
id: 3,
name: 'item3'
},
{
id: 4,
name: 'item4'
}
])
const elRef = Vue.ref(null)
useDraggable(elRef, items, { animation: 150 })
return {
items,
elRef
}
}
}).mount('#app')
</script>
</body>
irmantus
How can I use CDN version, is not very clear. I'm keep getting [Vue warn]: Component is missing template or render function.