vue3 拖拽插件 vue.draggable.next

hykeda3年前Vue2732

官网地址:https://github.com/SortableJS/vue.draggable.next

安装:

npm i -S vuedraggable@next

引入插件:

import draggable from 'vuedraggable'

基础使用:

<draggable v-model="myArray" item-key="id">
  <template #item="{element}">
      <div> {{element.name}} </div>
  </template>
</draggable>

const myArray = [
    {name:'123',id:1},
    {name:'456',id:2} 
]

配置信息请看官网说明

相关文章

Vue2.x笔记

vue2.0 开始不能挂载到<html> 或者 <body> 上。 transition 动画过渡的时候,如果是:<transit...

Vuex 通俗版教程告诉你Vuex怎么用

最近一直在用vue开发项目,写来写去就是那么些方法,对于简单的项目一些常用的vue方法足以解决,但是涉及到页面状态,权限判断等一些复杂的传值,vuex是必须的。对于vuex也运用一段时间,但是总觉得...

vite+vue3项目中js方法调用

这这里一创建一个axios接口demo为例:首先安装axios,打开官方GitHub:https://github.com/axios/axios或者访问中文网站:https://www.axios-...

vue 中父组件要向子组件通过props传值出现延时处理方案

在开发vue是,父组件要向子组件传值,但是这个值是父组件通过接口请求的,如果直接通过<ABC :abc="data"/>这样在子组件中获取到的abc是为空,因...

vite配置代理proxy实现跨域问题

最近在开发vite+vue项目时,调用接口获取服务器数据时提示接口有跨域问题,解决办法是配置代理:export default defineConfig({  //配置代理  se...

vue3中给响应式数据赋值操作,以及toRef 和 toRefs区别

最近在开发vue3时,定义了一个变量:let form = reactive({});form = res.items;这里我将接口获取到的数据直接赋给了form,这样我在表单中:<el-for...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。