vxe-table 如何关闭虚拟滚动、设置虚拟滚动触发规则

vxe-table提供虚拟滚动以提升性能,但某些功能如展开行、自适应高度不支持。通过设置scroll-x和scroll-y参数控制虚拟滚动,值为-1可关闭。全局与局部设置可结合项目需求调整,关闭虚拟渲染可能导致数据量大时卡顿。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

vxe-table 如何关闭虚拟滚动、设置虚拟滚动触发规则

vxe-table 支持高性能的虚拟渲染,但是有些功能是不支持虚拟渲染的,比如展开行、自适应高度…等
虚拟滚动的参数是由以下控制的:
scroll-x 用于控制横向虚拟滚动,gt 当大于指定条数时自动启用,默认 60,如果为 -1 则关闭虚拟滚动
scroll-y 用于控制纵向虚拟滚动,gt 当大于指定条数时自动启用,默认 100,如果为 -1 则关闭虚拟滚动

全局设置

VXETable.setup({
  table: {
	  scrollX: {
	    gt: 200 // 当大于指定条数时自动启用横向虚拟滚动,如果为 -1 则默认关闭虚拟滚动
	  },
	  scrolly: {
	    gt: 60 // 当大于指定条数时自动启用纵向虚拟滚动,如果为 -1 则默认关闭虚拟滚动
	  }
  }
})

局部设置

关闭虚拟渲染后如果数据量过大,将必然卡顿!!!
具体根据项目场景自行取舍。

<vxe-grid
	:scroll-x="{gt: -1}"
	:scroll-y="{gt: -1}"
	...>
</vxe-grid>

建议全局启用,特殊场景局部关闭,这样更好一些;当然具体取决于项目环境,如果项目中全部都用了特殊功能,那就默认全部关闭即可。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值