IT小书童 - 为程序员提供优质教程和文档

sortable.js onMove 拖拽中的事件，拖拽过程中（替换其他元素位置）执行返回true可以替换位置，返回false取消替换位置。

sortable.js onUpdate 拖拽元素更改变化的事件，元素的增加减少并不会触发，而onSort无论是位置变化还是元素的增加移除都会执行onSort事件。

sortable.js chosenClass 选中拖拽对象的样式,当设置了delay延迟属性就很容易理解这个属性了，比如delay延迟1秒当鼠标按住1秒后才会添加chosenClass样式到选中的对象。

通过dragClass属性设置拖拽对象移动样式，需要注意的是css可能需要!important属性进行覆盖同时设置forceFallback: true禁用html5原生拖拽。

sortable.js onChoose 选中事件,当用户点击要拖拽的对象后会回调该事件。

当使用sortable.js进行拖拽时，可以使用ghostClass属性来自定义停靠位置样式，需要注意的是在自定义样式里面你可能需要用到css的!important属性才能覆盖原有的样式。

sortable.js dataIdAttr属性获取排序后的数据，默认为data-id,你可以根据需要进行自定义data的名称。

sortable.js draggable 指定样式类的元素才允许拖动,比如指定类名为item的元素才允许拖动，但是需要注意的是设置该属性时需要在样式名之前加点。

sortable.js filter 过滤或忽略指定元素,比限制第二行不允许拖动。该属性可以设置不允许拖拽元素的class样式类名，也可以自定义函数返回true或flase进行控制。

sortable.js handle 指定拖拽句柄才能拖动父元素，有你拗口不好表达，我们理解成我们要拖拽item 1元素，而这个元素包含了a、b、c 三元素，我们可以通过handle属性指定按住a时才能拖动item 1元素。

sortable.js animation 动画，如果不设置animation属性拖拽时的过渡效果会非常生硬。

sortable.js的delayOnTouchOnly属性为true时，delay属性只在移动触摸时生效。

sortable.js delay属性鼠标按下后多久才允许拖动，比如你拖拽的元素还包含其他事件如编辑删除事件，如果不设置该属性虽然可以执行删除事件，但是该元素会被轻微的被拖动一下，用户体验非常不好。

sortable.js sort属性是否允许组内排序，注意这并不是不允许拖动而是是否允许排序，比如有多组时，sort设置了false,a组可以拖动到b组，但是不能在a组内拖动排序。

sortable.js 多组间相互拖动排序，从a组拖动元素到b组或从a组克隆元素到b组。group是多组之间相互拖拽最重要的属性，下面为group属性的说明。

比如我们有一个文章列表，我们可以设置文章排序字段数字大小然后ajax刷选数据进行排序，这种方法比较简单但是用户体验不好，本章节将通过sortable.js对表格进行排序实现更好的用户体验。

vue的ag-grid插入数据新增行比传统版简单得多，只需要往数组里插入一行即可实现。

本章节演示如果通过ag-grid vue来全选反选并获取选中数据，实现这些功能也是通过ag-grid的api实现，如果需要了解其他API可以点击本教程的非VUE菜单查看具体用法。

上一篇讲解了ag-grid vue在vscode和webpack环境中的用法，那么本篇将介绍ag-grid vue umd浏览器直接引入js版用法，需要注意的是注册注册ag-grid-vue组件，注册成功了用法就和webpack差不多了。

ITXST.COM 为程序员提供优质教程和文档