vue vuedraggable table行拖动

1.安装插件

npm i vuedraggable --save

2.按需引入

import draggable from 'vuedraggable'

3.使用部分

<div class="property_table_part">
                    <thead>
                        <tr>
                            <th  width="200">属性名称</th>
                            <th  width="40">层级</th>
                            <th  width="60">隐藏/显示</th>
                            <th  width="40">排序</th>
                            <th  width="60">操作</th>
                        </tr>
                    </thead>
                    <draggable
                        class="widget-area"
                        :move="widgetMove"
                        @add="doNothing"
                        style="padding-top: 2px"
                        @update="datadragEnd"
                    >
                    <tr v-for="(item,index) in propertyTableData" :key="index"> 
                        <td width="200">{{item.name}}</td>
                        <td  width="40">{{item.level}}</td>
                        <td  width="60">{{item.isShow}}</td>
                        <td  width="40">{{index}}</td>
                        <td  width="60"><a>编辑</a></td>
                    </tr>

                    </draggable>
                </div>