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

BootstrapVue Aspect 设置宽高比

BootstrapVue Aspect 组件设置宽高比,当组件内容低于设定的宽高比时组件会按设定的比例渲染,如果内容高于设定的比例就会按内容高度渲染。

BootstrapVue Alerts 警告框

BootstrapVue Alerts警告框来代替js原生的alert方法有更好的UI和体验,但需要注意的是BootstrapVue的Alerts并不像原生js的alert是阻塞(一旦弹出用户无法继续其他操作只能确认)的。

sortable.js onRemove 把元素从组移除事件

sortable.js onRemove 把元素从组移除事件,可以获取到那个元素被移除了。

sortable.js onSort 拖拽位置发生改变的事件

sortable.js onSort 拖拽位置发生改变的事件,比如有两个拖拽组a和b,你无论是a组内拖拽排序还是从a组拖往b组都会触发onSort,而onUpdate事件只会发生在a组或者b组元素被增加或者减少时才会执行。

sortable.js onAdd 多组拖拽时新增元素事件

sortable.js onAdd 多组拖拽时新增元素事件,本组内拖拽不会触发onAdd事件因为没有新增元素。

sortable.js onUnchoose 取消选中事件

sortable.js选中需要拖拽对象后松开鼠标会执行onUnchoose事件,表示用户放弃了拖拽行为。

sortable.js onChange 拖拽中位置发生改变后的事件

sortable.js onChange 拖拽中位置发生改变后的事件,鼠标不用松开也会触发onChange事件。

sortable.js onEnd 拖动结束后的事件

sortable.js onEnd 拖动结束后的事件,可以利用该事件处理拖拽完成后的相关事件,比如更新数据库对应的排序字段。

sortable.js onStart 开始拖动的事件

sortable.js onStart 开始拖动的事件,执行的顺序在onChoose选中顺序之后。

sortable.js onClone 克隆事件

sortable.js onClone 克隆事件,group属性设置了clone后多组间拖拽时会触发该事件。

sortable.js onMove 拖拽中的事件

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

sortable.js onUpdate 拖拽元素更改变化的事件,元素的增加减少并不会触发

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

sortable.js chosenClass 选中拖拽对象的样式

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

sortable.js dragClass 拖拽对象移动样式

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

sortable.js onChoose 选中事件

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

sortable.js ghostClass 自定义停靠位置样式

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

sortable.js dataIdAttr 获取排序后的数据

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

sortable.js draggable 指定样式类的元素才允许拖动

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

sortable.js filter 过滤或忽略指定元素

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

sortable.js handle 指定拖拽句柄才能拖动父元素

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