vxe-table 4.8.0 → 4.8.2

package/packages/locale/lang/ja-JP.ts

@@ -62,6 +62,7 @@ export default {
       impSuccess: '{0} レコードがインポートされました',
       expLoading: 'エクスポート中',
       expSuccess: 'エクスポートが成功しました',
+      expError: 'Export failure',
       expOriginFilename: 'エクスポート_{0}',
       expSrcFilename: 'エクスポート_ソース_{0}',
       customTitle: '列設定',
@@ -70,7 +71,8 @@ export default {
       customClose: '关闭',
       customCancel: 'Cancel',
       customRestore: 'リセット',
-      maxFixedCol: '最大固定列数が {0} です。'
+      maxFixedCol: '最大固定列数が {0} です。',
+      dragTip: '移动：{0}'
     },
     grid: {
       selectOneRecord: '1つ以上のレコードを選択してください',
@@ -121,7 +123,7 @@ export default {
       cstmCancel: 'キャンセル',
       cstmConfirm: 'OK',
       cstmConfirmRestore: '列をデフォルト状態に戻します。よろしいですか？',
-      cstmDragTarget: '移動ターゲット: {0}',
+      cstmDragTarget: '移动：{0}',
       setting: {
         colSort: 'ソート',
         sortHelpTip: 'ドラッグして列を並べ替えます',

package/packages/locale/lang/ko-KR.ts

@@ -62,6 +62,7 @@ export default {
       impSuccess: '成功导入 {0} 条记录',
       expLoading: '正在导出中',
       expSuccess: '导出成功',
+      expError: 'Export failure',
       expFilename: '导出_{0}',
       expOriginFilename: '导出_源_{0}',
       customTitle: '列设置',
@@ -70,7 +71,8 @@ export default {
       customClose: '关闭',
       customCancel: '取消',
       customRestore: '恢复默认',
-      maxFixedCol: '最大冻结列的数量不能超过 {0} 个'
+      maxFixedCol: '最大冻结列的数量不能超过 {0} 个',
+      dragTip: '移动：{0}'
     },
     grid: {
       selectOneRecord: '请至少选择一条记录！',
@@ -121,7 +123,7 @@ export default {
       cstmCancel: '取消',
       cstmConfirm: '确定',
       cstmConfirmRestore: '请确认是否恢复成默认列配置？',
-      cstmDragTarget: '移动目标：{0}',
+      cstmDragTarget: '移动：{0}',
       setting: {
         colSort: '排序',
         sortHelpTip: '点击并拖动图标可以调整列的排序',

package/packages/locale/lang/pt-BR.ts

@@ -62,6 +62,7 @@ export default {
       impSuccess: 'Importado com sucesso {0} registros',
       expLoading: 'Exportando',
       expSuccess: 'Exportado com sucesso',
+      expError: 'Export failure',
       expFilename: 'Exportar_{0}',
       expOriginFilename: 'Exportar_original_{0}',
       customTitle: 'Configurações de coluna',
@@ -70,7 +71,8 @@ export default {
       customClose: '关闭',
       customCancel: 'Cancel',
       customRestore: 'Restore',
-      maxFixedCol: 'The maximum number of Freeze columns cannot exceed {0}'
+      maxFixedCol: 'The maximum number of Freeze columns cannot exceed {0}',
+      dragTip: '移动：{0}'
     },
     grid: {
       selectOneRecord: 'Por favor, selecione pelo menos um registro!',
@@ -121,7 +123,7 @@ export default {
       cstmCancel: 'Cancelar',
       cstmConfirm: 'Confirm',
       cstmConfirmRestore: 'Please confirm whether to restore the default column configuration?',
-      cstmDragTarget: 'Moving target: {0}',
+      cstmDragTarget: 'Moving: {0}',
       setting: {
         colSort: 'Sort',
         sortHelpTip: 'Click and drag the icon to adjust the order of the columns.',

package/packages/locale/lang/ru-RU.ts

@@ -62,6 +62,7 @@ export default {
       impSuccess: 'Успешно импортировано {0} записей.',
       expLoading: 'Экспорт',
       expSuccess: 'Экспорт выполнен успешно',
+      expError: 'Export failure',
       expFilename: 'Экспорт_{0}',
       expOriginFilename: 'экспорт_источник_{0}',
       customTitle: 'Настройки столбца',
@@ -70,7 +71,8 @@ export default {
       customClose: 'закрытие',
       customCancel: 'Отмена',
       customRestore: 'Восстановить настройки по умолчанию',
-      maxFixedCol: 'Максимальное количество замороженных столбцов не может превышать {0}.'
+      maxFixedCol: 'Максимальное количество замороженных столбцов не может превышать {0}.',
+      dragTip: '移动：{0}'
     },
     grid: {
       selectOneRecord: 'Пожалуйста, выберите хотя бы одну запись!',
@@ -121,7 +123,7 @@ export default {
       cstmCancel: 'Отмена',
       cstmConfirm: 'Конечно',
       cstmConfirmRestore: 'Пожалуйста, подтвердите, нужно ли восстановить конфигурацию столбца по умолчанию?',
-      cstmDragTarget: 'Движущаяся цель: {0}',
+      cstmDragTarget: '移动：{0}',
       setting: {
         colSort: 'сортировать',
         sortHelpTip: 'Нажмите и перетащите значок, чтобы изменить порядок столбцов.',

package/packages/locale/lang/uk-UA.ts

@@ -62,6 +62,7 @@ export default {
       impSuccess: '成功导入 {0} 条记录',
       expLoading: '正在导出中',
       expSuccess: '导出成功',
+      expError: '导出失败',
       expFilename: '导出_{0}',
       expOriginFilename: '导出_源_{0}',
       customTitle: '列设置',
@@ -70,7 +71,8 @@ export default {
       customClose: '关闭',
       customCancel: '取消',
       customRestore: '恢复默认',
-      maxFixedCol: '最大冻结列的数量不能超过 {0} 个'
+      maxFixedCol: '最大冻结列的数量不能超过 {0} 个',
+      dragTip: '移动：{0}'
     },
     grid: {
       selectOneRecord: '请至少选择一条记录！',
@@ -121,7 +123,7 @@ export default {
       cstmCancel: '取消',
       cstmConfirm: '确定',
       cstmConfirmRestore: '请确认是否恢复成默认列配置？',
-      cstmDragTarget: '移动目标：{0}',
+      cstmDragTarget: '移动：{0}',
       setting: {
         colSort: '排序',
         sortHelpTip: '点击并拖动图标可以调整列的排序',

package/packages/locale/lang/vi-VN.ts

@@ -62,6 +62,7 @@ export default {
       impSuccess: '成功导入 {0} 条记录',
       expLoading: '正在导出中',
       expSuccess: '导出成功',
+      expError: '导出失败',
       expFilename: '导出_{0}',
       expOriginFilename: '导出_源_{0}',
       customTitle: '列设置',
@@ -70,7 +71,8 @@ export default {
       customClose: '关闭',
       customCancel: '取消',
       customRestore: '恢复默认',
-      maxFixedCol: '最大冻结列的数量不能超过 {0} 个'
+      maxFixedCol: '最大冻结列的数量不能超过 {0} 个',
+      dragTip: '移动：{0}'
     },
     grid: {
       selectOneRecord: '请至少选择一条记录！',
@@ -121,7 +123,7 @@ export default {
       cstmCancel: '取消',
       cstmConfirm: '确定',
       cstmConfirmRestore: '请确认是否恢复成默认列配置？',
-      cstmDragTarget: '移动目标：{0}',
+      cstmDragTarget: '移动：{0}',
       setting: {
         colSort: '排序',
         sortHelpTip: '点击并拖动图标可以调整列的排序',

package/packages/locale/lang/zh-CHT.ts

@@ -62,6 +62,7 @@ export default {
       impSuccess: '成功導入 {0} 筆記錄',
       expLoading: '正在匯出中',
       expSuccess: '匯出成功',
+      expError: '导出失败',
       expFilename: '導出_{0}',
       expOriginFilename: '匯出_來源_{0}',
       customTitle: '列設定',
@@ -70,7 +71,8 @@ export default {
       customClose: '關閉',
       customCancel: '取消',
       customRestore: '恢復預設',
-      maxFixedCol: '最大凍結列的數量不能超過 {0} 個'
+      maxFixedCol: '最大凍結列的數量不能超過 {0} 個',
+      dragTip: '移动：{0}'
     },
     grid: {
       selectOneRecord: '請至少選擇一筆記錄！',
@@ -121,7 +123,7 @@ export default {
       cstmCancel: '取消',
       cstmConfirm: '確定',
       cstmConfirmRestore: '請確認是否恢復成預設列配置？',
-      cstmDragTarget: '移動目標：{0}',
+      cstmDragTarget: '移動：{0}',
       setting: {
         colSort: '排序',
         sortHelpTip: '點擊並拖曳圖示可以調整列的排序',

package/packages/locale/lang/zh-CN.ts

@@ -62,6 +62,7 @@ export default {
       impSuccess: '成功导入 {0} 条记录',
       expLoading: '正在导出中',
       expSuccess: '导出成功',
+      expError: '导出失败',
       expFilename: '导出_{0}',
       expOriginFilename: '导出_源_{0}',
       customTitle: '列设置',
@@ -70,7 +71,8 @@ export default {
       customClose: '关闭',
       customCancel: '取消',
       customRestore: '恢复默认',
-      maxFixedCol: '最大冻结列的数量不能超过 {0} 个'
+      maxFixedCol: '最大冻结列的数量不能超过 {0} 个',
+      dragTip: '移动：{0}'
     },
     grid: {
       selectOneRecord: '请至少选择一条记录！',
@@ -121,7 +123,7 @@ export default {
       cstmCancel: '取消',
       cstmConfirm: '确定',
       cstmConfirmRestore: '请确认是否恢复成默认列配置？',
-      cstmDragTarget: '移动目标：{0}',
+      cstmDragTarget: '移动：{0}',
       setting: {
         colSort: '排序',
         sortHelpTip: '点击并拖动图标可以调整列的排序',

package/packages/table/module/custom/panel.ts

@@ -261,7 +261,7 @@ export default defineComponent({
       addClass(trEl, 'active--drag-origin')
     }
 
-    const sortMouseupEvent = (evnt: DragEvent) => {
+    const sortMouseupEvent = (evnt: MouseEvent) => {
       const btnEl = evnt.currentTarget as HTMLElement
       const tdEl = btnEl.parentNode as HTMLElement
       const trEl = tdEl.parentNode as HTMLElement

package/packages/table/module/edit/hook.ts

@@ -16,7 +16,7 @@ hooks.add('tableEditModule', {
   setupTable ($xeTable) {
     const { props, reactData, internalData } = $xeTable
     const { refElem } = $xeTable.getRefMaps()
-    const { computeMouseOpts, computeEditOpts, computeCheckboxOpts, computeTreeOpts } = $xeTable.getComputeMaps()
+    const { computeMouseOpts, computeEditOpts, computeCheckboxOpts, computeTreeOpts, computeValidOpts } = $xeTable.getComputeMaps()
 
     let editMethods = {} as TableEditMethods
     let editPrivateMethods = {} as TableEditPrivateMethods
@@ -528,6 +528,7 @@ hooks.add('tableEditModule', {
         const { editStore } = reactData
         const { actived, focused } = editStore
         const { row, column } = actived
+        const validOpts = computeValidOpts.value
         if (row || column) {
           syncActivedCell()
           actived.args = null
@@ -543,9 +544,11 @@ hooks.add('tableEditModule', {
             $columnIndex: $xeTable.getVMColumnIndex(column)
           }, evnt || null)
         }
-        if (getConfig().cellVaildMode === 'obsolete') {
-          if ($xeTable.clearValidate) {
-            return $xeTable.clearValidate()
+        if (validOpts.autoClear) {
+          if (validOpts.msgMode !== 'full' || getConfig().cellVaildMode === 'obsolete') {
+            if ($xeTable.clearValidate) {
+              return $xeTable.clearValidate()
+            }
           }
         }
         focused.row = null

package/packages/table/src/body.ts

@@ -1,4 +1,4 @@
-import { createCommentVNode, defineComponent, h, ref, Ref, PropType, inject, nextTick, ComputedRef, onBeforeUnmount, onMounted, onUnmounted } from 'vue'
+import { createCommentVNode, defineComponent, TransitionGroup, h, ref, Ref, PropType, inject, nextTick, ComputedRef, onBeforeUnmount, onMounted, onUnmounted } from 'vue'
 import XEUtils from 'xe-utils'
 import { VxeUI } from '../../ui'
 import { mergeBodyMethod, getRowid, XEBodyScrollElement } from './util'
@@ -353,7 +353,7 @@ export default defineComponent({
           getPropClass(className, params),
           getPropClass(allCellClassName, params)
         ],
-        key: columnKey || columnOpts.useKey ? colid : $columnIndex,
+        key: columnKey || columnOpts.useKey || rowOpts.useKey ? colid : $columnIndex,
         ...attrs,
         style: Object.assign({
           height: cellHeight
@@ -379,7 +379,7 @@ export default defineComponent({
         let rowIndex = $rowIndex
         // 确保任何情况下 rowIndex 都精准指向真实 data 索引
         rowIndex = $xeTable.getRowIndex(row)
-        // 事件绑定
+        // 当前行事件
         if (rowOpts.isHover || highlightHoverRow) {
           trOn.onMouseenter = (evnt: any) => {
             if (isVMScrollProcess()) {
@@ -394,6 +394,12 @@ export default defineComponent({
             $xeTable.clearHoverRow()
           }
         }
+        // 拖拽行事件
+        if (rowOpts.drag) {
+          trOn.onDragstart = $xeTable.handleRowDragDragstartEvent
+          trOn.onDragend = $xeTable.handleRowDragDragendEvent
+          trOn.onDragover = $xeTable.handleRowDragDragoverEvent
+        }
         const rowid = getRowid($xeTable, row)
         const rest = fullAllDataRowIdData[rowid]
         let rowLevel = 0
@@ -438,7 +444,7 @@ export default defineComponent({
             ],
             rowid: rowid,
             style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : null,
-            key: (rowKey || rowOpts.useKey) || treeConfig ? rowid : $rowIndex,
+            key: rowKey || rowOpts.useKey || rowOpts.drag || treeConfig ? rowid : $rowIndex,
             ...trOn
           }, tableColumn.map((column: any, $columnIndex: any) => {
             return renderColumn(seq, rowid, fixedType, rowLevel, row, rowIndex, $rowIndex, _rowIndex, column, $columnIndex, tableColumn, tableData)
@@ -700,9 +706,10 @@ export default defineComponent({
     const renderVN = () => {
       let { fixedColumn, fixedType, tableColumn } = props
       const { keyboardConfig, showOverflow: allColumnOverflow, spanMethod, mouseConfig } = tableProps
-      const { tableData, mergeList, scrollYLoad, isAllOverflow } = tableReactData
+      const { tableData, mergeList, scrollYLoad, isAllOverflow, isDragRowMove } = tableReactData
       const { visibleColumn } = tableInternalData
       const { slots } = tableContext
+      const rowOpts = computeRowOpts.value
       const sYOpts = computeSYOpts.value
       const emptyOpts = computeEmptyOpts.value
       const keyboardOpts = computeKeyboardOpts.value
@@ -782,9 +789,16 @@ export default defineComponent({
           /**
            * 内容
            */
-          h('tbody', {
-            ref: refBodyTBody
-          }, renderRows(fixedType, tableData, tableColumn))
+          rowOpts.drag
+            ? h(TransitionGroup, {
+              name: `vxe-body--row-list${isDragRowMove ? '' : '-disabled'}`,
+              tag: 'tbody'
+            }, {
+              default: () => renderRows(fixedType, tableData, tableColumn)
+            })
+            : h('tbody', {
+              ref: refBodyTBody
+            }, renderRows(fixedType, tableData, tableColumn))
         ]),
         h('div', {
           class: 'vxe-table--checkbox-range'

package/packages/table/src/cell.ts

@@ -8,7 +8,7 @@ import { getSlotVNs } from '../../ui/src/vn'
 
 import type { VxeTableConstructor, VxeTableDefines, VxeColumnPropTypes, VxeTablePrivateMethods, VxeComponentSlotType } from '../../../types'
 
-const { getI18n, getIcon, renderer, formats } = VxeUI
+const { getI18n, getIcon, renderer, formats, renderEmptyElement } = VxeUI
 
 function renderTitlePrefixIcon (params: VxeTableDefines.CellRenderHeaderParams) {
   const { $table, column } = params
@@ -46,6 +46,46 @@ function renderTitleSuffixIcon (params: VxeTableDefines.CellRenderHeaderParams)
     : []
 }
 
+function renderCellDragIcon (params: VxeTableDefines.CellRenderBodyParams) {
+  const { $table } = params
+  const { computeDragOpts } = $table.getComputeMaps()
+  const dragOpts = computeDragOpts.value
+  const { rowDisabledMethod } = dragOpts
+  const isDisabled = rowDisabledMethod && rowDisabledMethod(params)
+  return h('span', {
+    key: 'dg',
+    class: ['vxe-cell--drag-handle', {
+      'is--disabled': isDisabled
+    }],
+    onMousedown (evnt) {
+      if (!isDisabled) {
+        $table.handleCellDragMousedownEvent(evnt, params)
+      }
+    },
+    onMouseup: $table.handleCellDragMouseupEvent
+  }, [
+    h('i', {
+      class: 'vxe-table-icon-drag-handle'
+    })
+  ])
+}
+
+function renderCellBaseVNs (params: VxeTableDefines.CellRenderBodyParams, content: VxeComponentSlotType | VxeComponentSlotType[]) {
+  const { $table, column } = params
+  const { dragSort } = column
+  const vns: VxeComponentSlotType[] = XEUtils.isArray(content) ? content : [content]
+  const { computeRowOpts, computeDragOpts } = $table.getComputeMaps()
+  const rowOpts = computeRowOpts.value
+  const dragOpts = computeDragOpts.value
+  const { showRowIcon, rowVisibleMethod } = dragOpts
+  if (dragSort && rowOpts.drag && (showRowIcon && (!rowVisibleMethod || rowVisibleMethod(params)))) {
+    vns.unshift(
+      renderCellDragIcon(params)
+    )
+  }
+  return vns
+}
+
 function renderTitleContent (params: VxeTableDefines.CellRenderHeaderParams, content: VxeComponentSlotType | VxeComponentSlotType[]) {
   const { $table, column } = params
   const { props, reactData } = $table
@@ -250,7 +290,7 @@ export const Cell = {
     const renderOpts = editRender || cellRender
     const defaultSlot = slots ? slots.default : null
     if (defaultSlot) {
-      return $table.callSlot(defaultSlot, params)
+      return renderCellBaseVNs(params, $table.callSlot(defaultSlot, params))
     }
     if (renderOpts) {
       const compConf = renderer.get(renderOpts.name)
@@ -259,13 +299,13 @@ export const Cell = {
         const rtDefault = compConf.renderTableDefault || compConf.renderDefault
         const renderFn = editRender ? rtCell : rtDefault
         if (renderFn) {
-          return getSlotVNs(renderFn(renderOpts, Object.assign({ $type: editRender ? 'edit' : 'cell' }, params)))
+          return renderCellBaseVNs(params, getSlotVNs(renderFn(renderOpts, Object.assign({ $type: editRender ? 'edit' : 'cell' }, params))))
         }
       }
     }
     const cellValue = $table.getCellLabel(row, column)
     const cellPlaceholder = editRender ? editRender.placeholder : ''
-    return [
+    return renderCellBaseVNs(params, [
       h('span', {
         class: 'vxe-cell--label'
       }, [
@@ -277,7 +317,7 @@ export const Cell = {
           : h('span', formatText(cellValue, 1))
       ]
       )
-    ]
+    ])
   },
   renderTreeCell (params: VxeTableDefines.CellRenderBodyParams) {
     return Cell.renderTreeIcon(params, Cell.renderDefaultCell(params) as VNode[])
@@ -377,11 +417,13 @@ export const Cell = {
     const { slots } = column
     const defaultSlot = slots ? slots.default : null
     if (defaultSlot) {
-      return $table.callSlot(defaultSlot, params)
+      return renderCellBaseVNs(params, $table.callSlot(defaultSlot, params))
     }
     const { seq } = params
     const seqMethod = seqOpts.seqMethod
-    return [formatText(seqMethod ? seqMethod(params) : treeConfig ? seq : (seqOpts.startIndex || 0) + (seq as number), 1)]
+    return renderCellBaseVNs(params, [
+      h('span', `${formatText(seqMethod ? seqMethod(params) : treeConfig ? seq : (seqOpts.startIndex || 0) + (seq as number), 1)}`)
+    ])
   },
   renderTreeIndexCell (params: VxeTableDefines.CellRenderBodyParams) {
     return Cell.renderTreeIcon(params, Cell.renderSeqCell(params) as VNode[])
@@ -432,7 +474,7 @@ export const Cell = {
     }
     const radioParams = { ...params, checked: isChecked, disabled: isDisabled, visible: isVisible }
     if (radioSlot) {
-      return $table.callSlot(radioSlot, radioParams)
+      return renderCellBaseVNs(params, $table.callSlot(radioSlot, radioParams))
     }
     const radioVNs: VNode[] = []
     if (isVisible) {
@@ -449,7 +491,7 @@ export const Cell = {
         }, defaultSlot ? $table.callSlot(defaultSlot, radioParams) : XEUtils.get(row, labelField as string))
       )
     }
-    return [
+    return renderCellBaseVNs(params, [
       h('span', {
         class: ['vxe-cell--radio', {
           'is--checked': isChecked,
@@ -457,7 +499,7 @@ export const Cell = {
         }],
         ...ons
       }, radioVNs)
-    ]
+    ])
   },
   renderTreeRadioCell (params: VxeTableDefines.CellRenderBodyParams) {
     return Cell.renderTreeIcon(params, Cell.renderRadioCell(params))
@@ -555,7 +597,7 @@ export const Cell = {
     }
     const checkboxParams = { ...params, checked: isChecked, disabled: isDisabled, visible: isVisible, indeterminate }
     if (checkboxSlot) {
-      return $table.callSlot(checkboxSlot, checkboxParams)
+      return renderCellBaseVNs(params, $table.callSlot(checkboxSlot, checkboxParams))
     }
     const checkVNs: VNode[] = []
     if (isVisible) {
@@ -572,7 +614,7 @@ export const Cell = {
         }, defaultSlot ? $table.callSlot(defaultSlot, checkboxParams) : XEUtils.get(row, labelField as string))
       )
     }
-    return [
+    return renderCellBaseVNs(params, [
       h('span', {
         class: ['vxe-cell--checkbox', {
           'is--checked': isChecked,
@@ -582,7 +624,7 @@ export const Cell = {
         }],
         ...ons
       }, checkVNs)
-    ]
+    ])
   },
   renderTreeSelectionCell (params: VxeTableDefines.CellRenderBodyParams) {
     return Cell.renderTreeIcon(params, Cell.renderCheckboxCell(params))
@@ -623,7 +665,7 @@ export const Cell = {
     }
     const checkboxParams = { ...params, checked: isChecked, disabled: isDisabled, visible: isVisible, indeterminate: isIndeterminate }
     if (checkboxSlot) {
-      return $table.callSlot(checkboxSlot, checkboxParams)
+      return renderCellBaseVNs(params, $table.callSlot(checkboxSlot, checkboxParams))
     }
     const checkVNs: VNode[] = []
     if (isVisible) {
@@ -640,7 +682,7 @@ export const Cell = {
         )
       }
     }
-    return [
+    return renderCellBaseVNs(params, [
       h('span', {
         class: ['vxe-cell--checkbox', {
           'is--checked': isChecked,
@@ -650,7 +692,7 @@ export const Cell = {
         }],
         ...ons
       }, checkVNs)
-    ]
+    ])
   },
   renderTreeSelectionCellByProp (params: VxeTableDefines.CellRenderBodyParams) {
     return Cell.renderTreeIcon(params, Cell.renderCheckboxCellByProp(params))
@@ -672,7 +714,7 @@ export const Cell = {
     let isAceived = false
     let isLazyLoading = false
     if (iconSlot) {
-      return $table.callSlot(iconSlot, params)
+      return renderCellBaseVNs(params, $table.callSlot(iconSlot, params))
     }
     if (!isHidden) {
       const rowid = getRowid($table, row)
@@ -681,7 +723,7 @@ export const Cell = {
         isLazyLoading = !!rowExpandLazyLoadedMaps[rowid]
       }
     }
-    return [
+    return renderCellBaseVNs(params, [
       showIcon && (!visibleMethod || visibleMethod(params))
         ? h('span', {
           class: ['vxe-table--expanded', {
@@ -695,13 +737,13 @@ export const Cell = {
             class: ['vxe-table--expand-btn', isLazyLoading ? (iconLoaded || getIcon().TABLE_EXPAND_LOADED) : (isAceived ? (iconOpen || getIcon().TABLE_EXPAND_OPEN) : (iconClose || getIcon().TABLE_EXPAND_CLOSE))]
           })
         ])
-        : null,
+        : renderEmptyElement($table),
       defaultSlot || labelField
         ? h('span', {
           class: 'vxe-table--expand-label'
         }, defaultSlot ? $table.callSlot(defaultSlot, params) : XEUtils.get(row, labelField as string))
-        : null
-    ]
+        : renderEmptyElement($table)
+    ])
   },
   renderExpandData (params: VxeTableDefines.CellRenderDataParams) {
     const { $table, column } = params
@@ -730,14 +772,14 @@ export const Cell = {
     const { slots } = column
     const defaultSlot = slots ? slots.default : null
     if (defaultSlot) {
-      return $table.callSlot(defaultSlot, params)
+      return renderCellBaseVNs(params, $table.callSlot(defaultSlot, params))
     }
-    return [
+    return renderCellBaseVNs(params, [
       h('span', {
         class: 'vxe-cell--html',
         innerHTML: getDefaultCellLabel(params)
       })
-    ]
+    ])
   },
   renderTreeHTMLCell (params: VxeTableDefines.CellRenderBodyParams) {
     return Cell.renderTreeIcon(params, Cell.renderHTMLCell(params) as VNode[])
@@ -906,14 +948,14 @@ export const Cell = {
       return []
     }
     if (defaultSlot) {
-      return $table.callSlot(defaultSlot, cellParams)
+      return renderCellBaseVNs(params, $table.callSlot(defaultSlot, cellParams))
     }
     if (formatter) {
-      return [
+      return renderCellBaseVNs(params, [
         h('span', {
           class: 'vxe-cell--label'
         }, getDefaultCellLabel(cellParams))
-      ]
+      ])
     }
     return Cell.renderDefaultCell(cellParams)
   }

package/packages/table/src/column.ts

@@ -81,8 +81,10 @@ export const columnProps = {
   filterRecoverMethod: Function as PropType<VxeColumnPropTypes.FilterRecoverMethod>,
   // 筛选模板配置项
   filterRender: Object as PropType<VxeColumnPropTypes.FilterRender>,
-  // 指定为树节点
+  // 设置为树节点
   treeNode: Boolean as PropType<VxeColumnPropTypes.TreeNode>,
+  // 指定为树节点
+  dragSort: Boolean as PropType<VxeColumnPropTypes.DragSort>,
   // 是否可视
   visible: {
     type: Boolean as PropType<VxeColumnPropTypes.Visible>,

package/packages/table/src/columnInfo.ts

@@ -84,6 +84,7 @@ export class ColumnInfo {
       filterRecoverMethod: _vm.filterRecoverMethod,
       filterRender: _vm.filterRender,
       treeNode: _vm.treeNode,
+      dragSort: _vm.dragSort,
       cellType: _vm.cellType,
       cellRender: _vm.cellRender,
       editRender: _vm.editRender,

package/packages/table/src/emits.ts

@@ -42,6 +42,10 @@ export default [
   'menu-click',
   'edit-closed',
 
+  'row-dragstart',
+  'row-dragover',
+  'row-dragend',
+
   'edit-actived', // 废弃
 
   'edit-activated',

package/packages/table/src/props.ts

@@ -187,6 +187,8 @@ export default {
   cellConfig: Object as PropType<VxeTablePropTypes.CellConfig>,
   // 行配置信息
   rowConfig: Object as PropType<VxeTablePropTypes.RowConfig>,
+  // 可拖拽配置项
+  dragConfig: Object as PropType<VxeTablePropTypes.DragConfig>,
   // 列调整配置项
   resizableConfig: Object as PropType<VxeTablePropTypes.ResizableConfig>,
   // 序号配置项