refactor(table): 移除本地存储清理逻辑并改用sessionStorage存储表格尺寸
- 删除了定期清理本地存储相关代码 - 去除了dayjs依赖和相关时间判断 - 将表格尺寸的存储由localStorage改为sessionStorage,提高会话隔离性1.0
parent
6cd9cdaa50
commit
f0397081d0
|
|
@ -7,38 +7,6 @@ import { getDataType, getIndexColumn } from "../../utils";
|
||||||
import "use-antd-resizable-header/dist/style.css";
|
import "use-antd-resizable-header/dist/style.css";
|
||||||
import "./index.less";
|
import "./index.less";
|
||||||
|
|
||||||
const CLEANUP_INTERVAL_DAYS = 10; // 清理间隔天数
|
|
||||||
const LAST_CLEANUP_KEY = "tableLocalStorageLastCleanup"; // 最后清理时间存储key
|
|
||||||
|
|
||||||
// 清理本地存储中特定后缀的key
|
|
||||||
function cleanupTableLocalStorage() {
|
|
||||||
const now = dayjs();
|
|
||||||
const lastCleanupStr = localStorage.getItem(LAST_CLEANUP_KEY);
|
|
||||||
const lastCleanup = lastCleanupStr ? dayjs(lastCleanupStr) : null;
|
|
||||||
|
|
||||||
// 如果没有上次清理时间或距离上次清理已超过10天
|
|
||||||
if (!lastCleanup || now.diff(lastCleanup, "day") >= CLEANUP_INTERVAL_DAYS) {
|
|
||||||
// 查找并清理符合条件的key
|
|
||||||
const keysToRemove = [];
|
|
||||||
for (let i = 0; i < localStorage.length; i++) {
|
|
||||||
const key = localStorage.key(i);
|
|
||||||
if (key && (key.endsWith("#columnState")
|
|
||||||
|| key.endsWith("#size")
|
|
||||||
|| key.endsWith("#resizable"))) {
|
|
||||||
keysToRemove.push(key);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 删除匹配的key
|
|
||||||
keysToRemove.forEach((key) => {
|
|
||||||
localStorage.removeItem(key);
|
|
||||||
});
|
|
||||||
|
|
||||||
// 更新最后清理时间
|
|
||||||
localStorage.setItem(LAST_CLEANUP_KEY, now.toISOString());
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function getPersistenceKey(index) {
|
function getPersistenceKey(index) {
|
||||||
const basename = process.env?.app?.basename;
|
const basename = process.env?.app?.basename;
|
||||||
const pathname = decodeURIComponent(window.location.pathname);
|
const pathname = decodeURIComponent(window.location.pathname);
|
||||||
|
|
@ -52,11 +20,11 @@ function getPersistenceKey(index) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function getTableSize(index) {
|
function getTableSize(index) {
|
||||||
return window.localStorage.getItem(getPersistenceKey(index).size);
|
return window.sessionStorage.getItem(getPersistenceKey(index).size);
|
||||||
}
|
}
|
||||||
|
|
||||||
function setTableSize(value, index) {
|
function setTableSize(value, index) {
|
||||||
return window.localStorage.setItem(getPersistenceKey(index).size, value);
|
return window.sessionStorage.setItem(getPersistenceKey(index).size, value);
|
||||||
}
|
}
|
||||||
|
|
||||||
function Table(props) {
|
function Table(props) {
|
||||||
|
|
@ -94,7 +62,7 @@ function Table(props) {
|
||||||
columns,
|
columns,
|
||||||
columnsState: {
|
columnsState: {
|
||||||
persistenceKey: persistenceKey.resizable,
|
persistenceKey: persistenceKey.resizable,
|
||||||
persistenceType: "localStorage",
|
persistenceType: "sessionStorage",
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -146,8 +114,6 @@ function Table(props) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
cleanupTableLocalStorage();
|
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
if (mutationObserver && resizeObserver && enabledResizer) {
|
if (mutationObserver && resizeObserver && enabledResizer) {
|
||||||
resizeObserver.unobserve(document.body);
|
resizeObserver.unobserve(document.body);
|
||||||
|
|
@ -203,7 +169,7 @@ function Table(props) {
|
||||||
components={components}
|
components={components}
|
||||||
columnsState={{
|
columnsState={{
|
||||||
persistenceKey: persistenceKey.columnState,
|
persistenceKey: persistenceKey.columnState,
|
||||||
persistenceType: "localStorage",
|
persistenceType: "sessionStorage",
|
||||||
}}
|
}}
|
||||||
onSizeChange={setSize}
|
onSizeChange={setSize}
|
||||||
columns={processedColumns}
|
columns={processedColumns}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue