Commit 969ac76b6c14d3a292559138a9ea06727b7efc9a
1 parent
ba5b70af
处理虚拟滚动报错问题;
Showing
3 changed files
with
72 additions
and
69 deletions
src/components/Common/CommonTable/index.js
| ... | ... | @@ -61,8 +61,8 @@ import CommonListSelect from '@/components/Common/CommonListSelect'; |
| 61 | 61 | import CommonListTreeSelect from '@/components/Common/CommonListTreeSelect'; |
| 62 | 62 | import AntdDraggableDiv from '@/components/Common/AntdDraggableDiv'; |
| 63 | 63 | import SlaveMemo from '@/components/Common/SlaveMemo'; |
| 64 | -// import { VList } from '@/components/Vlist'; | |
| 65 | -// import { VList as VListNew } from '@/components/VlistNew'; | |
| 64 | +import { VList } from '@/components/Vlist'; | |
| 65 | +import { VList as VListNew } from '@/components/VlistNew'; | |
| 66 | 66 | import SvgIcon from "../../SvgIcon"; |
| 67 | 67 | import PrintPdf from '@/components/PrintPdf/PrintPdf'; |
| 68 | 68 | import OfficePreview from '@/components/Common/OfficePreview'; |
| ... | ... | @@ -1804,67 +1804,67 @@ class CommonTableRc extends React.Component { |
| 1804 | 1804 | noVlistTable = true; |
| 1805 | 1805 | } |
| 1806 | 1806 | // 判断是否有合并单元格, 有的话默认关闭虚拟滚动 |
| 1807 | - // if (this.mergeCellStateMap) { | |
| 1808 | - // for (let key in this.mergeCellStateMap) { | |
| 1809 | - // if (this.mergeCellStateMap[key]) { | |
| 1810 | - // noVlistController= true; | |
| 1811 | - // } | |
| 1812 | - // } | |
| 1813 | - // } | |
| 1807 | + if (this.mergeCellStateMap) { | |
| 1808 | + for (let key in this.mergeCellStateMap) { | |
| 1809 | + if (this.mergeCellStateMap[key]) { | |
| 1810 | + noVlistController= true; | |
| 1811 | + } | |
| 1812 | + } | |
| 1813 | + } | |
| 1814 | 1814 | |
| 1815 | - // if (!noVlistTable) { | |
| 1816 | - // if (this.props.slaveInfo || this.useVListNew) { | |
| 1817 | - // if (!this.uniqueId || window.vlistNewSearh) { | |
| 1818 | - // this.uniqueId = this.props.formId ? `${this.props.formId}_${lodash.uniqueId()}` : lodash.uniqueId(); | |
| 1819 | - // } | |
| 1820 | - // if (!this.Vcomponents || window.vlistNewSearh) { | |
| 1821 | - // const { tableClassName } = this.state; | |
| 1822 | - // const oTable = document.querySelectorAll(`.${tableClassName}`)[0]; | |
| 1823 | - // if (oTable) { | |
| 1824 | - // const oBody = oTable.querySelector('.ant-table-body'); | |
| 1825 | - // oBody && (oBody.scrollTop = 0); | |
| 1826 | - // } | |
| 1827 | - // window.vlistNewSearh = null; | |
| 1828 | - // this.Vcomponents = VListNew({height: this.scrollY, vid: this.uniqueId, onScroll: () => { | |
| 1829 | - // setTimeout(() => { | |
| 1830 | - // let divs = document.getElementsByClassName('noInputInsert'); | |
| 1831 | - // if (divs.length) { | |
| 1832 | - // Array.prototype.forEach.call(divs, item => { | |
| 1833 | - // item.parentNode.parentNode.parentNode.parentNode.classList.add('insertTd'); | |
| 1834 | - // }); | |
| 1835 | - // } | |
| 1836 | - // }, 20); | |
| 1837 | - // }}); | |
| 1838 | - // } | |
| 1839 | - // components = {...this.Vcomponents, ...components}; | |
| 1840 | - // } else { | |
| 1841 | - // // vid是多个列表在同个页面中,同时渲染会促发问题 | |
| 1842 | - // // vid不可以为随机数,随机数会导致双击时,点击的两个VList id不同 | |
| 1843 | - // if (!this.uniqueId || window.vlistNewSearh) { | |
| 1844 | - // this.uniqueId = this.props.formId ? `${this.props.formId}_${lodash.uniqueId()}` : lodash.uniqueId(); | |
| 1845 | - // } | |
| 1846 | - // if (!this.Vcomponents1 || window.vlistNewSearh) { | |
| 1847 | - // const { tableClassName } = this.state; | |
| 1848 | - // const oTable = document.querySelectorAll(`.${tableClassName}`)[0]; | |
| 1849 | - // if (oTable) { | |
| 1850 | - // const oBody = oTable.querySelector('.ant-table-body'); | |
| 1851 | - // oBody && (oBody.scrollTop = 0); | |
| 1852 | - // } | |
| 1853 | - // window.vlistNewSearh = null; | |
| 1854 | - // this.Vcomponents1 = VListNew({ height: this.scrollY, vid: this.uniqueId, rowKey: this.rowKey, onScroll: () => { | |
| 1855 | - // setTimeout(() => { | |
| 1856 | - // let divs = document.getElementsByClassName('noInputInsert'); | |
| 1857 | - // if (divs.length) { | |
| 1858 | - // Array.prototype.forEach.call(divs, item => { | |
| 1859 | - // item.parentNode.parentNode.parentNode.parentNode.classList.add('insertTd'); | |
| 1860 | - // }); | |
| 1861 | - // } | |
| 1862 | - // }, 20); | |
| 1863 | - // } }); | |
| 1864 | - // } | |
| 1865 | - // components = { ...this.Vcomponents1, ...components }; | |
| 1866 | - // } | |
| 1867 | - // } | |
| 1815 | + if (!noVlistTable) { | |
| 1816 | + if (this.props.slaveInfo || this.useVListNew) { | |
| 1817 | + if (!this.uniqueId || window.vlistNewSearh) { | |
| 1818 | + this.uniqueId = this.props.formId ? `${this.props.formId}_${lodash.uniqueId()}` : lodash.uniqueId(); | |
| 1819 | + } | |
| 1820 | + if (!this.Vcomponents || window.vlistNewSearh) { | |
| 1821 | + const { tableClassName } = this.state; | |
| 1822 | + const oTable = document.querySelectorAll(`.${tableClassName}`)[0]; | |
| 1823 | + if (oTable) { | |
| 1824 | + const oBody = oTable.querySelector('.ant-table-body'); | |
| 1825 | + oBody && (oBody.scrollTop = 0); | |
| 1826 | + } | |
| 1827 | + window.vlistNewSearh = null; | |
| 1828 | + this.Vcomponents = VListNew({height: this.scrollY, vid: this.uniqueId, onScroll: () => { | |
| 1829 | + setTimeout(() => { | |
| 1830 | + let divs = document.getElementsByClassName('noInputInsert'); | |
| 1831 | + if (divs.length) { | |
| 1832 | + Array.prototype.forEach.call(divs, item => { | |
| 1833 | + item.parentNode.parentNode.parentNode.parentNode.classList.add('insertTd'); | |
| 1834 | + }); | |
| 1835 | + } | |
| 1836 | + }, 20); | |
| 1837 | + }}); | |
| 1838 | + } | |
| 1839 | + components = {...this.Vcomponents, ...components}; | |
| 1840 | + } else { | |
| 1841 | + // vid是多个列表在同个页面中,同时渲染会促发问题 | |
| 1842 | + // vid不可以为随机数,随机数会导致双击时,点击的两个VList id不同 | |
| 1843 | + if (!this.uniqueId || window.vlistNewSearh) { | |
| 1844 | + this.uniqueId = this.props.formId ? `${this.props.formId}_${lodash.uniqueId()}` : lodash.uniqueId(); | |
| 1845 | + } | |
| 1846 | + if (!this.Vcomponents1 || window.vlistNewSearh) { | |
| 1847 | + const { tableClassName } = this.state; | |
| 1848 | + const oTable = document.querySelectorAll(`.${tableClassName}`)[0]; | |
| 1849 | + if (oTable) { | |
| 1850 | + const oBody = oTable.querySelector('.ant-table-body'); | |
| 1851 | + oBody && (oBody.scrollTop = 0); | |
| 1852 | + } | |
| 1853 | + window.vlistNewSearh = null; | |
| 1854 | + this.Vcomponents1 = VList({ height: this.scrollY, vid: this.uniqueId, rowKey: this.rowKey, onScroll: () => { | |
| 1855 | + setTimeout(() => { | |
| 1856 | + let divs = document.getElementsByClassName('noInputInsert'); | |
| 1857 | + if (divs.length) { | |
| 1858 | + Array.prototype.forEach.call(divs, item => { | |
| 1859 | + item.parentNode.parentNode.parentNode.parentNode.classList.add('insertTd'); | |
| 1860 | + }); | |
| 1861 | + } | |
| 1862 | + }, 20); | |
| 1863 | + } }); | |
| 1864 | + } | |
| 1865 | + components = { ...this.Vcomponents1, ...components }; | |
| 1866 | + } | |
| 1867 | + } | |
| 1868 | 1868 | if (this.props.config && this.props.config.iFreezeColumn) { |
| 1869 | 1869 | tableColumn.forEach((val, index) => { |
| 1870 | 1870 | if(tableColumn[index].fixedHelp) { | ... | ... |
src/components/Vlist/index.js
| 1 | 1 | /* eslint-disable */ |
| 2 | +import React from 'react'; | |
| 3 | + | |
| 2 | 4 | import './index.less'; |
| 3 | 5 | var throttleTime = 1; |
| 4 | 6 | |
| ... | ... | @@ -703,8 +705,7 @@ export function scrollTo(e) { |
| 703 | 705 | Object.defineProperty(exports, '__esModule', { |
| 704 | 706 | value: !0, |
| 705 | 707 | }); |
| 706 | -var React = require('react'), | |
| 707 | - React__default = _interopDefault(React), | |
| 708 | +var React__default = _interopDefault(React), | |
| 708 | 709 | __assign = function () { |
| 709 | 710 | return (__assign = |
| 710 | 711 | Object.assign || | ... | ... |
src/components/VlistNew/index.js
| 1 | 1 | /* eslint-disable */ |
| 2 | -var React = require('react'); | |
| 2 | +// var React = require('react'); | |
| 3 | +import React from 'react'; | |
| 4 | + | |
| 3 | 5 | |
| 4 | 6 | /****************************************************************************** |
| 5 | 7 | Copyright (c) Microsoft Corporation. |
| ... | ... | @@ -1000,7 +1002,7 @@ function VTable(props, otherParams) { |
| 1000 | 1002 | React.createElement("table", __assign({}, rest, { ref: tableRef, style: __assign(__assign({}, rest_style), { width: width, position: 'relative', transform: "translateY(-" + offsetStart + "px)" }) }), children)))); |
| 1001 | 1003 | } |
| 1002 | 1004 | // ================导出=================== |
| 1003 | -function VList(props) { | |
| 1005 | +export function VList(props) { | |
| 1004 | 1006 | 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; |
| 1005 | 1007 | // const resetScrollTopWhenDataChange = onReachEnd |
| 1006 | 1008 | // ? false |
| ... | ... | @@ -1032,7 +1034,7 @@ function VList(props) { |
| 1032 | 1034 | }, |
| 1033 | 1035 | }; |
| 1034 | 1036 | } |
| 1035 | -function scrollTo(option) { | |
| 1037 | +export function scrollTo(option) { | |
| 1036 | 1038 | var row = option.row, y = option.y, _a = option.vid, vid = _a === void 0 ? DEFAULT_VID : _a; |
| 1037 | 1039 | var _b = vidMap.get(vid), scrollNode = _b.scrollNode, rowItemHeight = _b.rowItemHeight; |
| 1038 | 1040 | if (row) { |
| ... | ... | @@ -1049,5 +1051,5 @@ function scrollTo(option) { |
| 1049 | 1051 | return { vid: vid, rowItemHeight: rowItemHeight }; |
| 1050 | 1052 | } |
| 1051 | 1053 | |
| 1052 | -exports.VList = VList; | |
| 1053 | -exports.scrollTo = scrollTo; | |
| 1054 | +// exports.VList = VList; | |
| 1055 | +// exports.scrollTo = scrollTo; | |
| 1054 | 1056 | \ No newline at end of file | ... | ... |