##drag-table-plugin

###一个适用于vue表格的横向拖拽插件 开发背景：现实需求中越来越多的表格内容充斥着有限的适口，这时表格的列过宽就会生成滚动条，想查看完整的表格就要横向拖拽滚动条，但如果表格内容过长则需要用户将表格滚到底部才能拖拽滚动条，非常不方便，所以这时可能需要一个可以直接用鼠标横向拖拽表格(容器)的插件。

####Features

• 将支持纵向的拖拽实现全方位的滚动
• 针对更多的UI组件库做快捷指令！
• 兼容大部分现代浏览器

####Install drag-table-plugin npm install drag-table-plugin --save

import dragTable from 'drag-table-plugin'
Vue.use(dragTable)

####Usage export default { data () { return { dragEl: { container: '', childBody: '' } } } }

####Mode Quick instructions: 现支持两个组件库的快捷指令

• element-ui
• view-design

exp:

<el-table 
  v-drag
...
>
  ...
</el-table>

当表格为element或iview的表格时v-drag后面不需要填写表达式

通用配置: v-drag接受一个表达式，该表达式类型为对象，对象内必须有一个container属性和一个childBody属性

| 属性名称 | 说明 | 备注 | | :----- | :------ | :------ | | container |视口容器dom，当此dom宽度小于包裹的内容宽度时产生滚动条，可通过ref获取|必须属性| | childBody |内容dom，可通过ref获取|必须属性|

注意: container和childBody为挂载期结束后的dom，而不是vnode，建议通过ref的$el获取到