From 969ac76b6c14d3a292559138a9ea06727b7efc9a Mon Sep 17 00:00:00 2001 From: zhangzhen <525765282@qq.com> Date: Wed, 21 May 2025 14:59:45 +0800 Subject: [PATCH] 处理虚拟滚动报错问题; --- src/components/Common/CommonTable/index.js | 124 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-------------------------------------------------------------- src/components/Vlist/index.js | 5 +++-- src/components/VlistNew/index.js | 12 +++++++----- 3 files changed, 72 insertions(+), 69 deletions(-) diff --git a/src/components/Common/CommonTable/index.js b/src/components/Common/CommonTable/index.js index fd2196b..49955fa 100644 --- a/src/components/Common/CommonTable/index.js +++ b/src/components/Common/CommonTable/index.js @@ -61,8 +61,8 @@ import CommonListSelect from '@/components/Common/CommonListSelect'; import CommonListTreeSelect from '@/components/Common/CommonListTreeSelect'; import AntdDraggableDiv from '@/components/Common/AntdDraggableDiv'; import SlaveMemo from '@/components/Common/SlaveMemo'; -// import { VList } from '@/components/Vlist'; -// import { VList as VListNew } from '@/components/VlistNew'; +import { VList } from '@/components/Vlist'; +import { VList as VListNew } from '@/components/VlistNew'; import SvgIcon from "../../SvgIcon"; import PrintPdf from '@/components/PrintPdf/PrintPdf'; import OfficePreview from '@/components/Common/OfficePreview'; @@ -1804,67 +1804,67 @@ class CommonTableRc extends React.Component { noVlistTable = true; } // 判断是否有合并单元格, 有的话默认关闭虚拟滚动 - // if (this.mergeCellStateMap) { - // for (let key in this.mergeCellStateMap) { - // if (this.mergeCellStateMap[key]) { - // noVlistController= true; - // } - // } - // } + if (this.mergeCellStateMap) { + for (let key in this.mergeCellStateMap) { + if (this.mergeCellStateMap[key]) { + noVlistController= true; + } + } + } - // if (!noVlistTable) { - // if (this.props.slaveInfo || this.useVListNew) { - // if (!this.uniqueId || window.vlistNewSearh) { - // this.uniqueId = this.props.formId ? `${this.props.formId}_${lodash.uniqueId()}` : lodash.uniqueId(); - // } - // if (!this.Vcomponents || window.vlistNewSearh) { - // const { tableClassName } = this.state; - // const oTable = document.querySelectorAll(`.${tableClassName}`)[0]; - // if (oTable) { - // const oBody = oTable.querySelector('.ant-table-body'); - // oBody && (oBody.scrollTop = 0); - // } - // window.vlistNewSearh = null; - // this.Vcomponents = VListNew({height: this.scrollY, vid: this.uniqueId, onScroll: () => { - // setTimeout(() => { - // let divs = document.getElementsByClassName('noInputInsert'); - // if (divs.length) { - // Array.prototype.forEach.call(divs, item => { - // item.parentNode.parentNode.parentNode.parentNode.classList.add('insertTd'); - // }); - // } - // }, 20); - // }}); - // } - // components = {...this.Vcomponents, ...components}; - // } else { - // // vid是多个列表在同个页面中,同时渲染会促发问题 - // // vid不可以为随机数,随机数会导致双击时,点击的两个VList id不同 - // if (!this.uniqueId || window.vlistNewSearh) { - // this.uniqueId = this.props.formId ? `${this.props.formId}_${lodash.uniqueId()}` : lodash.uniqueId(); - // } - // if (!this.Vcomponents1 || window.vlistNewSearh) { - // const { tableClassName } = this.state; - // const oTable = document.querySelectorAll(`.${tableClassName}`)[0]; - // if (oTable) { - // const oBody = oTable.querySelector('.ant-table-body'); - // oBody && (oBody.scrollTop = 0); - // } - // window.vlistNewSearh = null; - // this.Vcomponents1 = VListNew({ height: this.scrollY, vid: this.uniqueId, rowKey: this.rowKey, onScroll: () => { - // setTimeout(() => { - // let divs = document.getElementsByClassName('noInputInsert'); - // if (divs.length) { - // Array.prototype.forEach.call(divs, item => { - // item.parentNode.parentNode.parentNode.parentNode.classList.add('insertTd'); - // }); - // } - // }, 20); - // } }); - // } - // components = { ...this.Vcomponents1, ...components }; - // } - // } + if (!noVlistTable) { + if (this.props.slaveInfo || this.useVListNew) { + if (!this.uniqueId || window.vlistNewSearh) { + this.uniqueId = this.props.formId ? `${this.props.formId}_${lodash.uniqueId()}` : lodash.uniqueId(); + } + if (!this.Vcomponents || window.vlistNewSearh) { + const { tableClassName } = this.state; + const oTable = document.querySelectorAll(`.${tableClassName}`)[0]; + if (oTable) { + const oBody = oTable.querySelector('.ant-table-body'); + oBody && (oBody.scrollTop = 0); + } + window.vlistNewSearh = null; + this.Vcomponents = VListNew({height: this.scrollY, vid: this.uniqueId, onScroll: () => { + setTimeout(() => { + let divs = document.getElementsByClassName('noInputInsert'); + if (divs.length) { + Array.prototype.forEach.call(divs, item => { + item.parentNode.parentNode.parentNode.parentNode.classList.add('insertTd'); + }); + } + }, 20); + }}); + } + components = {...this.Vcomponents, ...components}; + } else { + // vid是多个列表在同个页面中,同时渲染会促发问题 + // vid不可以为随机数,随机数会导致双击时,点击的两个VList id不同 + if (!this.uniqueId || window.vlistNewSearh) { + this.uniqueId = this.props.formId ? `${this.props.formId}_${lodash.uniqueId()}` : lodash.uniqueId(); + } + if (!this.Vcomponents1 || window.vlistNewSearh) { + const { tableClassName } = this.state; + const oTable = document.querySelectorAll(`.${tableClassName}`)[0]; + if (oTable) { + const oBody = oTable.querySelector('.ant-table-body'); + oBody && (oBody.scrollTop = 0); + } + window.vlistNewSearh = null; + this.Vcomponents1 = VList({ height: this.scrollY, vid: this.uniqueId, rowKey: this.rowKey, onScroll: () => { + setTimeout(() => { + let divs = document.getElementsByClassName('noInputInsert'); + if (divs.length) { + Array.prototype.forEach.call(divs, item => { + item.parentNode.parentNode.parentNode.parentNode.classList.add('insertTd'); + }); + } + }, 20); + } }); + } + components = { ...this.Vcomponents1, ...components }; + } + } if (this.props.config && this.props.config.iFreezeColumn) { tableColumn.forEach((val, index) => { if(tableColumn[index].fixedHelp) { diff --git a/src/components/Vlist/index.js b/src/components/Vlist/index.js index 9519746..82c0c34 100644 --- a/src/components/Vlist/index.js +++ b/src/components/Vlist/index.js @@ -1,4 +1,6 @@ /* eslint-disable */ +import React from 'react'; + import './index.less'; var throttleTime = 1; @@ -703,8 +705,7 @@ export function scrollTo(e) { Object.defineProperty(exports, '__esModule', { value: !0, }); -var React = require('react'), - React__default = _interopDefault(React), +var React__default = _interopDefault(React), __assign = function () { return (__assign = Object.assign || diff --git a/src/components/VlistNew/index.js b/src/components/VlistNew/index.js index a04be92..6a1f5fc 100644 --- a/src/components/VlistNew/index.js +++ b/src/components/VlistNew/index.js @@ -1,5 +1,7 @@ /* eslint-disable */ -var React = require('react'); +// var React = require('react'); +import React from 'react'; + /****************************************************************************** Copyright (c) Microsoft Corporation. @@ -1000,7 +1002,7 @@ function VTable(props, otherParams) { React.createElement("table", __assign({}, rest, { ref: tableRef, style: __assign(__assign({}, rest_style), { width: width, position: 'relative', transform: "translateY(-" + offsetStart + "px)" }) }), children)))); } // ================导出=================== -function VList(props) { +export function VList(props) { var _a = props.vid, vid = _a === void 0 ? DEFAULT_VID : _a, height = props.height, onReachEnd = props.onReachEnd, onScroll = props.onScroll, onListRender = props.onListRender, debounceListRenderMS = props.debounceListRenderMS; props.resetTopWhenDataChange; // const resetScrollTopWhenDataChange = onReachEnd // ? false @@ -1032,7 +1034,7 @@ function VList(props) { }, }; } -function scrollTo(option) { +export function scrollTo(option) { var row = option.row, y = option.y, _a = option.vid, vid = _a === void 0 ? DEFAULT_VID : _a; var _b = vidMap.get(vid), scrollNode = _b.scrollNode, rowItemHeight = _b.rowItemHeight; if (row) { @@ -1049,5 +1051,5 @@ function scrollTo(option) { return { vid: vid, rowItemHeight: rowItemHeight }; } -exports.VList = VList; -exports.scrollTo = scrollTo; +// exports.VList = VList; +// exports.scrollTo = scrollTo; \ No newline at end of file -- libgit2 0.22.2