Package Exports
- vue-virtual-draglist
- vue-virtual-draglist/dist/vue-virtual-draglist.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vue-virtual-draglist) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
可拖拽排序的表格组件（暂不支持拖拽和表格）
Simple usage
npm i vue-virtual-draglist -DRoot component:
<template>
<div>
<virtual-drag-list
:data-key="'uid'"
:data-source="list"
>
<template #item="{ record, index, dataKey }">
{{ record.text }}
</template>
</virtual-drag-list>
</div>
</template>
<script>
import virtualDragList from 'vue-virtual-scroll-list'
export default {
name: 'root',
data () {
return {
list: [{id: '1', text: 'asd'}, {uid: '2', text: 'fgh'}, ...]
}
},
components: { virtualDragList }
}
</script>Props type
Required props
| Prop | Type | Description |
|---|---|---|
data-key |
String | 每一条数据的唯一标识 |
data-source |
Array | 数据源 |
Optional props
Commonly used
| Prop | Type | Default | Description |
|---|---|---|---|
keeps |
Number | 30 | 虚拟滚动展示的数据量 |
size |
Number | 50 | 每一条数据的预估高度，可选择传或不传，会自动计算 |
Public methods
Usefull public methods
使用 ref 去获取组件内部的方法
| Method | Description |
|---|---|
scrollToBottom() |
滚动到底部 |
scrollToIndex(index) |
滚动到指定index值位置 |
scrollToOffset(offset) |
滚动到指定高度 |