{"versions":{"1.0.17":{"_args":[["fks-table-virtual-scroll@1.0.17","D:\\front-end"]],"_from":"fks-table-virtual-scroll@1.0.17","_id":"fks-table-virtual-scroll@1.0.17","_inBundle":false,"_integrity":"sha512-IXfHnUlZe5OuCSo3iN+X1+AnMpPKhY+SmyEdT+M3UrmuETe5raGb5By7tZ0YkOn3nTksGQl3So8jeT3OHqGPuA==","_location":"/fks-table-virtual-scroll","_phantomChildren":{},"_requested":{"type":"version","registry":true,"raw":"fks-table-virtual-scroll@1.0.17","name":"fks-table-virtual-scroll","escapedName":"fks-table-virtual-scroll","rawSpec":"1.0.17","saveSpec":null,"fetchSpec":"1.0.17"},"_requiredBy":["/"],"_resolved":"http://nexus.simulate.com:8081/repository/npm-group/fks-table-virtual-scroll/-/fks-table-virtual-scroll-1.0.17.tgz","_shasum":"42bea9c196a321a018fb3497eeb4df8d8540abcd","_spec":"1.0.17","_where":"D:\\front-end","author":{"name":"xiaocheng555"},"bugs":{"url":"https://github.com/xiaocheng555/fks-table-virtual-scroll/issues"},"deprecated":false,"description":"The virtual scrolling component developed based on the Table component of Element-UI supports dynamic height and solves the problem of scrolling stuck when the amount of data is large.","devDependencies":{"@babel/core":"^7.12.10","@babel/preset-env":"^7.12.11","autoprefixer":"^8.0.0","babel-eslint":"^10.1.0","eslint":"^6.8.0","eslint-config-standard":"^14.1.1","eslint-plugin-html":"^6.0.0","eslint-plugin-import":"^2.7.0","eslint-plugin-node":"^11.0.0","eslint-plugin-promise":"^4.0.1","eslint-plugin-standard":"^4.0.0","eslint-plugin-vue":"^7.4.1","rollup":"^2.36.1","rollup-plugin-babel":"^4.4.0","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-eslint":"^7.0.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^7.0.2","rollup-plugin-vue":"^5.0.1","vue":"^2.6.10","vue-template-compiler":"^2.6.10"},"homepage":"https://github.com/xiaocheng555/fks-table-virtual-scroll#readme","keywords":["vue","fks-table-virtual-scroll","virtual","scroll","fks-table","FawkesLib"],"license":"ISC","main":"dist/fks-table-virtual-scroll.umd.js","module":"dist/fks-table-virtual-scroll.esm.js","name":"fks-table-virtual-scroll","repository":{"type":"git","url":"git+https://github.com/xiaocheng555/fks-table-virtual-scroll.git"},"scripts":{"build":"npm run build:umd && npm run build:browser && npm run build:es","build:browser":"rollup --config ./build/rollup.config.browser.js","build:es":"rollup --config ./build/rollup.config.es.js","build:umd":"rollup --config ./build/rollup.config.umd.js"},"unpkg":"dist/fks-table-virtual-scroll.min.js","version":"1.0.17","_nodeVersion":"14.4.0","_npmVersion":"6.14.5","dist":{"integrity":"sha512-EWmJrAD8jtzAsRG6M/p7iplhGcTmnhHyJ6Vdia2MDKxd5YHnpLEMVMf+Y2ijJey8jP44C0l03IQY7oiKvUyFUw==","shasum":"7fb84719403aac2b8f60b7972b60838553cce5fb","tarball":"http://123.232.10.234:8212/nexus/content/groups/npm-public/fks-table-virtual-scroll/-/fks-table-virtual-scroll-1.0.17.tgz","fileCount":58,"unpackedSize":1112867,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCXjX9t3dCC27luqF9iP7Se6Ajzm+AgNSaRGytOkaN17QIgKqFIiCpzetI+0/JrJN1sSe4djJGgrutjcTx9hWWWIWM="}],"size":308618},"_npmUser":{"name":"anonymous","email":"463852540@qq.com"},"directories":{},"maintainers":[{"name":"anonymous","email":"463852540@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/fks-table-virtual-scroll_1.0.17_1725351325182_0.7403126328236738"},"_hasShrinkwrap":false,"_cnpmcore_publish_time":"2024-09-03T08:15:25.446Z","publish_time":1725351325446,"_source_registry_name":"default","contributors":[]}},"dist-tags":{"latest":"1.0.17"},"name":"fks-table-virtual-scroll","time":{"created":"2023-08-04T07:12:37.225Z","modified":"2024-09-03T09:10:42.256Z","1.0.17":"2024-09-03T08:15:25.446Z"},"readme":"# fks-table-virtual-scroll\n\n基于Element-UI的Table 组件开发的虚拟滚动组件，支持动态高度，解决数据量大时滚动卡顿的问题。\n\n⚠️仅支持vue2。\n\ndemo & 源码：https://xiaocheng555.github.io/fks-table-virtual-scroll/\n\n## 安装\n\n``` bash\n$ npm i fks-table-virtual-scroll -S\n```\n\n## 用法\n\n``` vue\n<virtual-scroll\n  :data=\"list\"\n  :item-size=\"62\"\n  key-prop=\"id\"\n  @change=\"(renderData) => virtualList = renderData\">\n  <fks-table \n    row-key=\"id\" \n    :data=\"virtualList\" \n    height=\"500px\">\n  </fks-table>\n</virtual-scroll>\n...\n\nimport VirtualScroll from 'fks-table-virtual-scroll'\n\nexport default {\n  component: {\n    VirtualScroll\n  },\n  data () {\n    list: [\n      {\n        id: 1,\n        text: 'content'\n      },\n      // ...... 省略n条\n      {\n        id: 2000,\n        text: 'content2'\n      }\n    ],\n    virtualList: []\n  }\n}\n```\n\n## fks-table-virtual-scroll 组件\n\n### Props\n| 参数      | 说明          | 类型      | 可选值                           | 默认值  |\n|---------- |-------------- |---------- |--------------------------------  |-------- |\n| data    | 总数据 | Array | 必填 |  |\n| keyProp | key值，data数据中的唯一id【⚠️若keyProp未设置或keyProp值不唯一，可能导致表格空数据或者滚动时渲染的数据断层、不连贯】 | string | — | id |\n| itemSize | 每一行的预估高度 | number | — | 60 |\n| scrollBox | 指定滚动容器；在指定滚动容器时，如果表格设置了height高度，则滚动容器为表格内的滚动容器；如果表格为设置height高度，则自动获取父层以外的滚动容器，直至window容器为止 | string | 'window'、css选择器 | - |\n| buffer | 顶部和底部缓冲区域，值越大显示表格的行数越多 | Number | — | 200 |\n| throttleTime | 滚动事件的节流时间 | number | — | 10 |\n| dynamic | 动态获取表格行高度，默认开启。设置为false时，则以itemSize为表格行的真实高度，能大大减少虚拟滚动计算量，减少滚动白屏；如果itemSize与表格行的真实高度不一致，可能导致滚动时表格数据错乱 | boolean | — | true |\n| virtualized | 是否开启虚拟滚动（>=1.0.3版本支持） | boolean | — | true |\n| rowSpanKey | 当使用了fks-table的合并行，必须设置rowSpanKey函数并返回每组合并行中共用的key值（>=1.0.13版本支持） | Function(row, index) | — | - |\n\n\n### Methods\n| 方法名 | 说明 | 参数 |\n|---------- |-------- |---------- |\n| scrollTo | 滚动到第几行 | index |\n| update | 更新，会重新计算实际渲染数据和位置 | - |\n| reset | 重置 | - |\n| clearSelection | 用于多选 `<virtual-column type=\"selection\">`，清空用户的选择 | - |\n| toggleRowSelection | 用于多选 `<virtual-column type=\"selection\">`, 切换某一行的选中状态，如果使用了第二个参数，则是设置这一行选中与否（selected 为 true 则选中） | row, selected |\n| toggleRowExpansion | 用于展开行 `<virtual-column type=\"expand\">`, 切换某一行的展开状态，如果使用了第二个参数，则是设置这一行展开与否（expanded 为 true 则展开）| row, expanded |\n| setCurrentRow | 用于单选 `<virtual-column type=\"radio\">`, 设定某一行为选中行 | row |\n\n\n### Events\n| 事件名称 | 说明 | 参数 |\n|---------- |-------- |---------- |\n| change | 计算完成真实显示的表格行数 | (renderData, start, end)：renderData 真实渲染的数据，start和end指的是渲染的数据在总数据的开始到结束的区间范围 |\n| current-change | 虚拟表格单选选中事件 | currentRow |\n| selection-change | 虚拟表格多选选项发生更改时触发事件 | selectedRows |\n\n## virtual-column 组件\n\n使用 `<fks-table-virtual-scroll>` 做表格虚拟滚动，是不支持 `ElementUI` 表格的原有的索引、单选、多选、扩展行等功能，需要使用 `<virtual-column>` 来兼容。`<virtual-column>` 组件内封装了 `<fks-table-column>`，支持传入 `<fks-table-column>` 组件的props属性。\n其中 `<virtual-column>` 会在表格row数据上扩展 `$v_checked`、`$v_expanded` ... 等属性，请悉知。 \n\n更多demo & 源码查看：https://xiaocheng555.github.io/fks-table-virtual-scroll/\n\n### 引入\n\n``` js\nimport { VirtualColumn } from 'fks-table-virtual-scroll'\n\n...\n\n<virtual-column type=\"index/selection/radio/expand/tree\"></virtual-column>\n```\n\n### Props\n| 参数      | 说明          | 类型      | 可选值                           | 默认值  |\n|---------- |-------------- |---------- |--------------------------------  |-------- |\n| * | 支持 `<fks-table-column>` 组件的props属性，如label, fixed, prop, width, min-width, index 等等 | - | — | - |\n| type    | type=\"index\" 为索引；type=\"selection\" 为多选；type=\"radio\" 为单选；type=\"expand\" 为扩展行；type=\"tree\" 为模拟树结构 | String | 选填 |  |\n| indent | 展示树形数据时，树节点的缩进，type 为 tree 时生效 | Number | — | 16 |\n| load | 加载子节点数据的函数，type 为 tree 时生效 | Function(row, resolve) | — | - |\n| vfixed | 固定列（>=1.0.16版本支持）。使用 position: sticky; 来实现固定列，不会生成额外table，滚动更丝滑；使用时，需要设置table的headerCellStyle、cellStyle（注意组件必须按固定列顺序排列最左或最右），参考[demo](https://xiaocheng555.github.io/fks-table-virtual-scroll/#/VFixedDemo) | String/Boolean | left/right/true | - |\n\n## fks-table-virtual-scroll 组件注意事项\n\n* 使用组件前，请确保项目中有引入 `element-ui` 组件库。\n\n* `<fks-table>` 组件最好写上 `row-key` 属性，能避免一些奇怪的问题。例：`<fks-table row-key=\"id\">`，其中id为数据中唯一key值。\n\n* 不支持 Element-UI Table 原有单选、多选、扩展行、索引，请使用 `<virtual-column>` 做兼容，详见demo。\n\n* 使用 Element-UI Table 排序时，需要做额外兼容，详见demo。\n\n## 更新内容\n\n### 2022-11-15\n\n* Prop `height` 废弃，改为使用 `item-size`，更具语义\n\n* Prop 增加 `scrollBox`，可以指定滚动容器\n\n* 修复data为空时，表格仍然撑起高度\n\n* 增加多个场景下的demo\n\n### 2022-12-14\n\n* 支持树结构虚拟滚动\n\n* 增加模拟树结构懒加载demo\n\n### 2022-12-30\n\n* 完善demo和api\n\n* npm 发包\n\n### 2023-1-9\n\n* 增加virtualized prop 来控制是否开启虚拟滚动\n\n* npm 1.0.3 版本发包\n\n### 2023-1-11\n\n* 修复表格多选 `selection-change` 事件中返回的数据没有按顺序排序\n\n* npm 1.0.5 版本发包\n\n### 2023-1-12\n\n* 用到的element-ui组件局部引入，无需安装loadsh\n\n* npm 1.0.6 版本发包\n\n### 2023-1-13\n\n* 修复element-ui组件局部引入方式不正确\n\n* npm 1.0.7 版本发包\n\n### 2023-1-13\n\n* 修复滚动容器设置为window时报错\n\n* 修复指定滚动容器，特殊情况滚动时表头会一直在\n\n* npm 1.0.8 版本发包\n\n\n### 2023-2-22\n\n* 修复 `<virtual-column>` 组件在低版本 `vue-template-compiler` 时会显示 `undefined`\n\n* npm 1.0.9 版本发包\n\n\n### 2023-2-27\n\n* 修复分页时全选框没有重置状态\n\n* npm 1.0.10 版本发包\n\n\n### 2023-3-2\n\n* 修复浏览器外链引入时，全局 ElemnetUI 引入错误\n\n* npm 1.0.11 版本发包\n\n\n### 2023-4-3\n\n* 修复pageckage.json中module文件引入不正确\n\n* npm 1.0.12 版本发包\n\n\n### 2023-4-12\n\n* 增加rowSpanKey 属性兼容表格合并行；增加相关demo\n\n* npm 1.0.13 版本发包\n\n\n### 2023-5-9\n\n* 修复 `<fks-table>` 组件设置 `max-height` 属性，虚拟滚动有问题；增加表尾合计行demo\n\n* npm 1.0.14 版本发包\n\n### 2023-7-26\n\n* `<virtual-column>` 组件增加 `vfixed: left/right` 来设置固定列，滚动更丝滑\n\n* npm 1.0.15 版本发包\n\n### 2023-7-27\n\n* 修复自定义固定列bug\n\n* npm 1.0.16 版本发包","users":{}}