releases 4.17.32

Author: xuliangzhan

examples/views/table/TableTest1.vue

@@ -9,7 +9,8 @@
       :floating-filter-config="floatingFilterConfig"
       :column-config="{resizable: true}"
       :virtual-x-config="{enabled: true, gt: 0}"
-      :data="tableData">
+      :data="tableData"
+      @context-menu="contextMenuEvent">
       <vxe-column field="col0" title="列0" width="160"></vxe-column>
       <vxe-column field="col1" title="列1" width="100"></vxe-column>
       <vxe-column field="col2" title="列2" width="160"></vxe-column>
@@ -143,4 +144,8 @@ const loadDataAndColumns = (rowSize: number) => {
 }
 
 loadDataAndColumns(20)
+
+const contextMenuEvent = () => {
+  console.log('11')
+}
 </script>

examples/views/table/TableTest5.vue

@@ -13,7 +13,8 @@
       :column-config="columnConfig"
       :menu-config="menuConfig"
       :data="demo1.tableData"
-      :footer-data="demo1.footerData">
+      :footer-data="demo1.footerData"
+      @context-menu="contextMenuEvent">
       <vxe-column type="seq" min-width="auto"></vxe-column>
       <vxe-column type="checkbox" title="ID"  min-width="auto"></vxe-column>
       <vxe-column
@@ -129,4 +130,8 @@ onMounted(() => {
     demo1.loading = false
   }, 100)
 })
+
+const contextMenuEvent = () => {
+  console.log('11')
+}
 </script>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-table",
-  "version": "4.17.30",
+  "version": "4.17.32",
   "description": "A PC-end table component based on Vxe UI, supporting copy-paste, data pivot table, and high-performance virtual list table solution.",
   "scripts": {
     "update": "npm install --legacy-peer-deps",

packages/table/src/emits.ts

@@ -12,6 +12,7 @@ export const tableEmits: VxeTableEmits = [
   'paste',
   'copy',
   'cut',
+  'context-menu',
 
   'columns-change',
   'data-change',

packages/table/src/table.ts

@@ -3948,18 +3948,6 @@ export default defineVxeComponent({
 
         handleReserveStatus()
         $xeTable.checkSelectionStatus()
-        if (initStatus) {
-          dispatchEvent('data-rendered', {
-            isReload,
-            visibleColumn: internalData.visibleColumn,
-            visibleData: internalData.afterFullData
-          }, null)
-        } else {
-          dispatchEvent('init-rendered', {
-            visibleColumn: internalData.visibleColumn,
-            visibleData: internalData.afterFullData
-          }, null)
-        }
         $xeTable.dispatchEvent('data-change', {
           visibleColumn: internalData.visibleColumn,
           visibleData: internalData.afterFullData
@@ -3986,6 +3974,7 @@ export default defineVxeComponent({
               reactData.isRowLoading = false
               handleRecalculateStyle(false, false, false)
               updateTreeLineStyle()
+
               // 如果是自动行高，特殊情况需调用 recalculate 手动刷新
               if (!props.showOverflow) {
                 setTimeout(() => {
@@ -4014,6 +4003,19 @@ export default defineVxeComponent({
                 })
               }
             })
+        }).then(() => {
+          if (initStatus) {
+            dispatchEvent('data-rendered', {
+              isReload,
+              visibleColumn: internalData.visibleColumn,
+              visibleData: internalData.afterFullData
+            }, null)
+          } else {
+            dispatchEvent('init-rendered', {
+              visibleColumn: internalData.visibleColumn,
+              visibleData: internalData.afterFullData
+            }, null)
+          }
         })
       })
     }
@@ -8130,6 +8132,10 @@ export default defineVxeComponent({
       }
     }
 
+    const contextMenuEvent = (evnt: MouseEvent) => {
+      dispatchEvent('context-menu', {}, evnt)
+    }
+
     /**
      * 全局键盘事件
      */
@@ -9074,6 +9080,10 @@ export default defineVxeComponent({
         Object.assign(reactData.columnStore, { resizeList, pxList, pxMinList, autoMinList, scaleList, scaleMinList, autoList, remainList })
       },
       handleColResizeMousedownEvent (evnt, fixedType, params) {
+        const isLeftBtn = evnt.button === 0
+        if (!isLeftBtn) {
+          return
+        }
         evnt.stopPropagation()
         evnt.preventDefault()
         const { column } = params
@@ -12941,10 +12951,12 @@ export default defineVxeComponent({
       const scrollbarYToLeft = computeScrollbarYToLeft.value
       const { isCrossTableDrag } = rowDragOpts
       const tbOns: {
+        onContextmenu: (...args: any[]) => void
         onKeydown: (...args: any[]) => void
         onDragover?: (...args: any[]) => void
       } = {
-        onKeydown: keydownEvent
+        onKeydown: keydownEvent,
+        onContextmenu: contextMenuEvent
       }
       if (isCrossTableDrag && !tableData.length) {
         tbOns.onDragover = $xeTable.handleCrossTableRowDragoverEmptyEvent