We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
当数据表格配置 virtual-scroll 和 virtual-scroll-x 打开横向虚拟滚动 纵向虚拟滚动 后 只要数据超过699051就不会显示后面的行。比如我设置了1000000 行,滚动条已拉到最后。
1 配置 virtual-scroll 打开纵向虚拟滚动 2 配置 virtual-scroll-x 打开横向虚拟滚动 3 设置1000000 行
testnv.zip
<template> <n-config-provider > <n-data-table :columns="columns" :data="data" :max-height="250" virtual-scroll virtual-scroll-x :scroll-x="scrollX" :min-row-height="48" :height-for-row="heightForRow" virtual-scroll-header :header-height="48" /> </n-config-provider> </template> <script> import { defineComponent } from "vue"; import { NConfigProvider,NDataTable } from 'naive-ui' const columns = []; let scrollX = 0; for (let i = 0; i < 5; ++i) { scrollX += 100; columns.push({ title: `Col ${i}`, width: 100, key: i, fixed: i <= 1 ? "left" : i > 997 ? "right" : void 0, render(_, rowIndex) { return `${i}-${rowIndex}`; } }); } export default defineComponent({ components:{ NDataTable, NConfigProvider }, setup() { const data = Array.from({ length: 1000000 }).map((_, index) => ({ key: index, name: `Edward King ${index}`, age: 32, address: `London, Park Lane no. ${index}` })); return { data, columns, scrollX, minRowHeight: 48, heightForRow: () => 48 }; } }); </script>
https://play.pro-components.cn/#eNp9VG1P2zAQ/iunCIkimpbxokFomRhjGhtiiPFh0jKtXuO2BseOHKcNqvrfd+c4abrR5Ut8z9n38jw+L4PLLOvNCx5EwcDyNJPM8otYAQxUONZqIqZhZvRcJNyAw50nYZaFlv2WvILoi8ZaFqnKh3HgV3HQ8tIRdNFvA09ZGc64mM4seg9PDtrOuTC2YDLMx0ZLuQ0Py1a4GsJg1fL7ZjahQqMX64zHpxv+Cg8n2tA29FfAR20e9GJ7aRiPIUMbgQh4LU+/orf/D7+ID/otDdDE6CKzbi3STBsLS0j4RCh+pdFWXFlYwcToFOIAVYyD8429d1cuxb3P0L37gPQ/km71sV3FxJyHhdilg1hRbsHLB0P48dPFk9yCZxPBA4chRdAhh3AQ/gZwcg77+2IPltRhfWB/CG8O6AzUgXtZkc86bhOAFVbyCEZXWsLOUqxG3QpfiMTOIjrqgWf+EoHwxkSUPEETBhgd3mH3kk9sHABhF3B29taBhth36FyLBOpQhitko/OrCyjyDa5LX3PltIVRMKJiwp1lvWM1ci0ArOi32kMLV7HipeMaVWGFdP+2OlWX49rMI59mLYQv6S+lXA7nyrGcrNPUVylEU4S0XxrDXnqkY2cJkqupZ4w+LLGXsqxDXYqqxeEF1KzXdJLDVwCgWEpKXCcLZhL4ItSUFKmabzaxKe45OlzbSWJ4nuO5W60Srbpwz8wz3DLFQeneOoJnb4+Ya/HcFEQ9NVH9TWlsf5kaG+cYB/KTm64Ijk8bR3teI0DesGmcvSq3y4yqOfUGfT9dQTeweTWLvadcK3wKXVH0jqWZkNx8zaxA3uMgqsuNAyalXnx2mDVFLSOemfHx8yv4U14SFgf3SBc3c5zVxmeZmXK8p+S+/nbHS1w3zlQnBb6z/3M+8Bz5ohqrbe8LlWDZrX2u2hv3LKCsj/l1abnK66ao0PWNcy8J3eBtra/LPeod15QGqz+4Tvt4
System: OS: Windows 11 10.0.22621 CPU: (20) x64 Intel(R) Xeon(R) CPU E5-2666 v3 @ 2.90GHz Memory: 17.95 GB / 31.84 GB Binaries: Node: 18.18.0 - C:\Program Files\nodejs\node.EXE npm: 9.8.1 - C:\Program Files\nodejs\npm.CMD Browsers: Edge: Chromium (121.0.2277.128) Internet Explorer: 11.0.22621.3527
npm
The text was updated successfully, but these errors were encountered:
No branches or pull requests
描述错误
当数据表格配置 virtual-scroll 和 virtual-scroll-x 打开横向虚拟滚动 纵向虚拟滚动 后
只要数据超过699051就不会显示后面的行。比如我设置了1000000 行,滚动条已拉到最后。
复现步骤
1 配置 virtual-scroll 打开纵向虚拟滚动
2 配置 virtual-scroll-x 打开横向虚拟滚动
3 设置1000000 行
testnv.zip
最小复现链接
https://play.pro-components.cn/#eNp9VG1P2zAQ/iunCIkimpbxokFomRhjGhtiiPFh0jKtXuO2BseOHKcNqvrfd+c4abrR5Ut8z9n38jw+L4PLLOvNCx5EwcDyNJPM8otYAQxUONZqIqZhZvRcJNyAw50nYZaFlv2WvILoi8ZaFqnKh3HgV3HQ8tIRdNFvA09ZGc64mM4seg9PDtrOuTC2YDLMx0ZLuQ0Py1a4GsJg1fL7ZjahQqMX64zHpxv+Cg8n2tA29FfAR20e9GJ7aRiPIUMbgQh4LU+/orf/D7+ID/otDdDE6CKzbi3STBsLS0j4RCh+pdFWXFlYwcToFOIAVYyD8429d1cuxb3P0L37gPQ/km71sV3FxJyHhdilg1hRbsHLB0P48dPFk9yCZxPBA4chRdAhh3AQ/gZwcg77+2IPltRhfWB/CG8O6AzUgXtZkc86bhOAFVbyCEZXWsLOUqxG3QpfiMTOIjrqgWf+EoHwxkSUPEETBhgd3mH3kk9sHABhF3B29taBhth36FyLBOpQhitko/OrCyjyDa5LX3PltIVRMKJiwp1lvWM1ci0ArOi32kMLV7HipeMaVWGFdP+2OlWX49rMI59mLYQv6S+lXA7nyrGcrNPUVylEU4S0XxrDXnqkY2cJkqupZ4w+LLGXsqxDXYqqxeEF1KzXdJLDVwCgWEpKXCcLZhL4ItSUFKmabzaxKe45OlzbSWJ4nuO5W60Srbpwz8wz3DLFQeneOoJnb4+Ya/HcFEQ9NVH9TWlsf5kaG+cYB/KTm64Ijk8bR3teI0DesGmcvSq3y4yqOfUGfT9dQTeweTWLvadcK3wKXVH0jqWZkNx8zaxA3uMgqsuNAyalXnx2mDVFLSOemfHx8yv4U14SFgf3SBc3c5zVxmeZmXK8p+S+/nbHS1w3zlQnBb6z/3M+8Bz5ohqrbe8LlWDZrX2u2hv3LKCsj/l1abnK66ao0PWNcy8J3eBtra/LPeod15QGqz+4Tvt4
系统信息
使用的包管理器
npm
验证
The text was updated successfully, but these errors were encountered: