lxm_front/vxe-table
1
0
Fork 0
mirror of synced 2025-12-09 23:57:39 +08:00
Code Issues Projects Releases Wiki Activity

优化滚动事件

Browse Source
This commit is contained in:
xuliangzhan
2021-12-28 21:14:54 +08:00
parent 751bee89d7
commit 2adc98fae7
18 changed files with 74 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
examples/api/table.ts
View File

@@ -1851,7 +1851,7 @@ const apis = [
},
{
name: 'header',
desc: '表头的快捷菜单',
desc: '表头的右键菜单',
version: '',
type: 'any',
enum: '',
@@ -1860,7 +1860,7 @@ const apis = [
},
{
name: 'body',
desc: '内容的快捷菜单',
desc: '内容的右键菜单',
version: '',
type: 'any',
enum: '',
@@ -1869,7 +1869,7 @@ const apis = [
},
{
name: 'footer',
desc: '表尾的快捷菜单',
desc: '表尾的右键菜单',
version: '',
type: 'any',
enum: '',
@@ -4588,7 +4588,7 @@ const apis = [
},
{
name: 'closeMenu()',
desc: '手动关闭快捷菜单（某些特殊场景可能会用到）',
desc: '手动关闭右键菜单（某些特殊场景可能会用到）',
version: '',
type: 'Promise<any>',
enum: '',

14
examples/i18n/lang/zh-CN.ts
View File

@@ -71,8 +71,8 @@ export default {
print: '打印',
customPrint: '高级打印',
fixedType: '固定类型 + 导入/导出',
contextMenu: '快捷菜单',
menuPrivilege: '快捷菜单 + 权限控制',
contextMenu: '右键菜单',
menuPrivilege: '右键菜单 + 权限控制',
footerImmediately: '表尾 + 实时更新合计',
expandRow: '展开行',
expandRowIcon: '展开行 + 更多自定义',
@@ -120,7 +120,7 @@ export default {
edit: '可编辑',
crudToolbar: '增删改查 + 工具栏',
lazy: '懒加载',
lazyMenu: '懒加载 + 快捷菜单',
lazyMenu: '懒加载 + 右键菜单',
lazyEdit: '懒加载 + 可编辑',
treeLine: '连接线',
full: '完整功能',
@@ -220,13 +220,13 @@ export default {
exportXLSXPlugin: 'plugin-export 导入/导出 xlsx',
exportPDFPlugin: 'plugin-export 导出 pdf',
rendererPlugin: 'plugin-renderer 更多渲染',
menusPlugin: 'plugin-menus 快捷菜单集',
menusPlugin: 'plugin-menus 右键菜单集',
treeRowPlugin: 'plugin-virtual-tree 虚拟树',
treeColPlugin: 'plugin-virtual-tree 横向与纵向',
formats: '(全局复用) 格式化',
commands: '(全局复用) 指令注册',
menus: '(全局复用) 快捷菜单',
menus: '(全局复用) 右键菜单',
renderer: '(高级用法) 渲染器',
rendererFilter: '筛选渲染',
@@ -450,7 +450,7 @@ export default {
tooltipConfig: 'tooltip 配置项',
expandConfig: '展开行配置项（不支持虚拟滚动）',
treeConfig: '树形结构配置项',
menuConfig: '快捷菜单配置项',
menuConfig: '右键菜单配置项',
contextMenu: '即将废弃，请使用 menu-config',
clipConfig: '复制/粘贴配置项',
fnrConfig: '查找/替换配置项',
@@ -494,7 +494,7 @@ export default {
resizableChange: '当列宽拖动发生变化时会触发该事件',
toggleExpandChange: '当行展开或收起时会触发该事件',
toggleTreeChange: '当树节点展开或收起时会触发该事件',
menuClick: '只对 menu-config 配置时有效，当点击快捷菜单时会触发该事件',
menuClick: '只对 menu-config 配置时有效，当点击右键菜单时会触发该事件',
contextMenuClick: '即将废弃，请使用 menu-click',
cellSelected: '只对 mouse-config.selected 配置时有效，单元格被选中时会触发该事件',
editClosed: '只对 edit-config 配置时有效，单元格编辑状态下被关闭时会触发该事件',

14
examples/i18n/lang/zh-TC.ts
View File

@@ -71,8 +71,8 @@ export default {
print: '打印',
customPrint: '高级打印',
fixedType: '固定类型 + 导入/导出',
contextMenu: '快捷菜单',
menuPrivilege: '快捷菜单 + 权限控制',
contextMenu: '右键菜单',
menuPrivilege: '右键菜单 + 权限控制',
footerImmediately: '表尾 + 实时更新合计',
expandRow: '展开行',
expandRowIcon: '展开行 + 更多自定义',
@@ -120,7 +120,7 @@ export default {
edit: '可编辑',
crudToolbar: '增删改查 + 工具栏',
lazy: '懒加载',
lazyMenu: '懒加载 + 快捷菜单',
lazyMenu: '懒加载 + 右键菜单',
lazyEdit: '懒加载 + 可编辑',
treeLine: '连接线',
full: '完整功能',
@@ -220,13 +220,13 @@ export default {
exportXLSXPlugin: 'plugin-export 导入/导出 xlsx',
exportPDFPlugin: 'plugin-export 导出 pdf',
rendererPlugin: 'plugin-renderer 更多渲染',
menusPlugin: 'plugin-menus 快捷菜单集',
menusPlugin: 'plugin-menus 右键菜单集',
treeRowPlugin: 'plugin-virtual-tree 虚拟树',
treeColPlugin: 'plugin-virtual-tree 横向与纵向',
formats: '(全局) 格式化',
commands: '(全局) 指令注册',
menus: '(全局) 快捷菜单',
menus: '(全局) 右键菜单',
renderer: '(高级用法) 渲染器',
rendererFilter: '筛选渲染',
@@ -450,7 +450,7 @@ export default {
tooltipConfig: 'tooltip 配置项',
expandConfig: '展开行配置项（不能用于虚拟滚动）',
treeConfig: '树形结构配置项（不能用于虚拟滚动）',
menuConfig: '快捷菜单配置项',
menuConfig: '右键菜单配置项',
contextMenu: '即将废弃，请使用 menu-config',
clipConfig: '复制/粘贴配置项',
fnrConfig: '查找/替换配置项',
@@ -494,7 +494,7 @@ export default {
resizableChange: '当列宽拖动发生变化时会触发该事件',
toggleExpandChange: '当行展开或收起时会触发该事件',
toggleTreeChange: '当树节点展开或收起时会触发该事件',
menuClick: '只对 menu-config 配置时有效，当点击快捷菜单时会触发该事件',
menuClick: '只对 menu-config 配置时有效，当点击右键菜单时会触发该事件',
contextMenuClick: '即将废弃，请使用 menu-click',
cellSelected: '只对 mouse-config.selected 配置时有效，单元格被选中时会触发该事件',
editClosed: '只对 edit-config 配置时有效，单元格编辑状态下被关闭时会触发该事件',

2
examples/views/grid/Menu.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<p class="tip">快捷菜单，实现对按钮的控制，通过 <table-api-link prop="visibleMethod"/> 和 <table-api-link prop="visible"/> | <table-api-link prop="disabled"/> 属性来控制菜单选项的操作权限</p>
<p class="tip">右键菜单，实现对按钮的控制，通过 <table-api-link prop="visibleMethod"/> 和 <table-api-link prop="visible"/> | <table-api-link prop="disabled"/> 属性来控制菜单选项的操作权限</p>
<vxe-grid
ref="xGrid"

2
examples/views/table/advanced/Menu.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<p class="tip">右键快捷菜单，支持表头菜单、内容菜单、表尾菜单，自定义样式，配置项 <table-api-link prop="menu-config"/>={header,body,footer}</p>
<p class="tip">右键菜单，支持表头菜单、内容菜单、表尾菜单，自定义样式，配置项 <table-api-link prop="menu-config"/>={header,body,footer}</p>
<vxe-table
border

2
examples/views/table/advanced/MenuPrivilege.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<p class="tip">右键快捷菜单，支持表头菜单、内容菜单、表尾菜单，通过 <table-api-link prop="visibleMethod"/> 和 <table-api-link prop="visible"/> | <table-api-link prop="disabled"/> 属性来控制菜单选项的操作权限</p>
<p class="tip">右键菜单，支持表头菜单、内容菜单、表尾菜单，通过 <table-api-link prop="visibleMethod"/> 和 <table-api-link prop="visible"/> | <table-api-link prop="disabled"/> 属性来控制菜单选项的操作权限</p>
<vxe-table
border

12
examples/views/table/advanced/Template.vue
View File

@@ -179,12 +179,12 @@ export default defineComponent({
isIndeterminate: false,
selectRecords: [] as any[],
tableData: [
{ id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', age: 28, address: 'test abc', flag: false, time: 1600261774531, html1: '<span style="color:red">vxe-table从入门到废弃</span>', img1: '/vxe-table/static/other/img1.gif' },
{ id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', age: 28, address: 'test abc', flag: false, time: 1600261774531, html1: '<span style="color:red">自定义HTML</span>', img1: '/vxe-table/static/other/img1.gif' },
{ id: 10002, name: 'Test2', role: 'Test', sex: 'Women', age: 22, address: 'Guangzhou', flag: false, time: 1600261774531, html1: '', img1: '/vxe-table/static/other/img1.gif' },
{ id: 10003, name: 'Test3', role: 'PM', sex: 'Man', age: 32, address: 'Shanghai', flag: true, time: 1600261774531, html1: '<span style="color:orange">vxe-table从入门到废弃</span>', img1: '/vxe-table/static/other/img2.gif' },
{ id: 10003, name: 'Test3', role: 'PM', sex: 'Man', age: 32, address: 'Shanghai', flag: true, time: 1600261774531, html1: '<span style="color:orange">自定义HTML</span>', img1: '/vxe-table/static/other/img2.gif' },
{ id: 10004, name: 'Test4', role: 'Designer', sex: 'Women', age: 23, address: 'test abc', flag: false, time: 1600261774531, html1: '', img1: '/vxe-table/static/other/img2.gif' },
{ id: 10005, name: 'Test5', role: 'Develop', sex: 'Women', age: 30, address: 'Shanghai', flag: true, time: 1600261774531, html1: '', img1: '/vxe-table/static/other/img1.gif' },
{ id: 10006, name: 'Test6', role: 'Designer', sex: 'Women', age: 21, address: 'test abc', flag: true, time: 1600261774531, html1: '<span style="color:blue">vxe-table从入门到废弃</span>', img1: '/vxe-table/static/other/img2.gif' },
{ id: 10006, name: 'Test6', role: 'Designer', sex: 'Women', age: 21, address: 'test abc', flag: true, time: 1600261774531, html1: '<span style="color:blue">自定义HTML</span>', img1: '/vxe-table/static/other/img2.gif' },
{ id: 10007, name: 'Test7', role: 'Test', sex: 'Man', age: 29, address: 'test abc', flag: false, time: 1600261774531, html1: '', img1: '/vxe-table/static/other/img1.gif' },
{ id: 10008, name: 'Test8', role: 'Develop', sex: 'Man', age: 35, address: 'test abc', flag: false, time: 1600261774531, html1: '', img1: '/vxe-table/static/other/img1.gif' }
],
@@ -423,12 +423,12 @@ export default defineComponent({
isIndeterminate: false,
selectRecords: [] as any[],
tableData: [
{ id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', age: 28, address: 'test abc', flag: false, time: 1600261774531, html1: '<span style="color:red">vxe-table从入门到废弃</span>', img1: '/vxe-table/static/other/img1.gif' },
{ id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', age: 28, address: 'test abc', flag: false, time: 1600261774531, html1: '<span style="color:red">自定义HTML</span>', img1: '/vxe-table/static/other/img1.gif' },
{ id: 10002, name: 'Test2', role: 'Test', sex: 'Women', age: 22, address: 'Guangzhou', flag: false, time: 1600261774531, html1: '', img1: '/vxe-table/static/other/img1.gif' },
{ id: 10003, name: 'Test3', role: 'PM', sex: 'Man', age: 32, address: 'Shanghai', flag: true, time: 1600261774531, html1: '<span style="color:orange">vxe-table从入门到废弃</span>', img1: '/vxe-table/static/other/img2.gif' },
{ id: 10003, name: 'Test3', role: 'PM', sex: 'Man', age: 32, address: 'Shanghai', flag: true, time: 1600261774531, html1: '<span style="color:orange">自定义HTML</span>', img1: '/vxe-table/static/other/img2.gif' },
{ id: 10004, name: 'Test4', role: 'Designer', sex: 'Women', age: 23, address: 'test abc', flag: false, time: 1600261774531, html1: '', img1: '/vxe-table/static/other/img2.gif' },
{ id: 10005, name: 'Test5', role: 'Develop', sex: 'Women', age: 30, address: 'Shanghai', flag: true, time: 1600261774531, html1: '', img1: '/vxe-table/static/other/img1.gif' },
{ id: 10006, name: 'Test6', role: 'Designer', sex: 'Women', age: 21, address: 'test abc', flag: true, time: 1600261774531, html1: '<span style="color:blue">vxe-table从入门到废弃</span>', img1: '/vxe-table/static/other/img2.gif' },
{ id: 10006, name: 'Test6', role: 'Designer', sex: 'Women', age: 21, address: 'test abc', flag: true, time: 1600261774531, html1: '<span style="color:blue">自定义HTML</span>', img1: '/vxe-table/static/other/img2.gif' },
{ id: 10007, name: 'Test7', role: 'Test', sex: 'Man', age: 29, address: 'test abc', flag: false, time: 1600261774531, html1: '', img1: '/vxe-table/static/other/img1.gif' },
{ id: 10008, name: 'Test8', role: 'Develop', sex: 'Man', age: 35, address: 'test abc', flag: false, time: 1600261774531, html1: '', img1: '/vxe-table/static/other/img1.gif' }
],

2
examples/views/table/edit/Menu.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<p class="tip">通过快捷菜单增删改查<span class="red">（具体请自行实现，该示例仅供参考）</span></p>
<p class="tip">通过右键菜单增删改查<span class="red">（具体请自行实现，该示例仅供参考）</span></p>
<vxe-toolbar>
<template #buttons>

2
examples/views/table/interceptor/API.vue
View File

@@ -175,7 +175,7 @@ export default defineComponent({
},
{
name: 'event.showMenu',
desc: '显示快捷菜单之前触发，允许返回 false 阻止默认行为',
desc: '显示右键菜单之前触发，允许返回 false 阻止默认行为',
version: '',
type: 'Boolean',
enum: '',

2
examples/views/table/menus/API.vue
View File

@@ -1,7 +1,7 @@
<template>
<div>
<h1>{{ $t('app.aside.nav.menus') }}</h1>
<p class="tip">将快捷菜单注册成全局可复用的</p>
<p class="tip">将右键菜单注册成全局可复用的</p>
<vxe-table
resizable
highlight-current-row

2
examples/views/table/scroll/LazyTree.vue
View File

@@ -1,7 +1,7 @@
<template>
<div>
<p class="tip">
虚拟树表格的懒加载和快捷菜单，通过调用 <table-api-link prop="clearTreeExpandLoaded"/> 方法清除加载完成状态，通过调用 <table-api-link prop="reloadTreeExpand"/> 方法重新加载子节点
虚拟树表格的懒加载和右键菜单，通过调用 <table-api-link prop="clearTreeExpandLoaded"/> 方法清除加载完成状态，通过调用 <table-api-link prop="reloadTreeExpand"/> 方法重新加载子节点
</p>
<vxe-table

2
examples/views/table/tree/LazyMenu.vue
View File

@@ -1,7 +1,7 @@
<template>
<div>
<p class="tip">
树表格的懒加载和快捷菜单，通过调用 <table-api-link prop="clearTreeExpandLoaded"/> 方法清除加载完成状态，通过调用 <table-api-link prop="reloadTreeExpand"/> 方法重新加载子节点
树表格的懒加载和右键菜单，通过调用 <table-api-link prop="clearTreeExpandLoaded"/> 方法清除加载完成状态，通过调用 <table-api-link prop="reloadTreeExpand"/> 方法重新加载子节点
</p>
<vxe-table

2
examples/views/table/tree/Menu.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<p class="tip">快捷菜单操作</p>
<p class="tip">右键菜单操作</p>
<vxe-toolbar custom></vxe-toolbar>