diff --git a/src/pages/ideContainer/market.tsx b/src/pages/ideContainer/market.tsx index 680c842..eb79fcc 100644 --- a/src/pages/ideContainer/market.tsx +++ b/src/pages/ideContainer/market.tsx @@ -423,8 +423,19 @@ const Market: React.FC = ({ updateProjectComp }) => { setSearchValue(value); }; - // 从缓存中获取组件列表的信息 - const getCompList = async () => { + // 从缓存中加载组件列表 + const loadCompListFromCache = () => { + const userInfo = JSON.parse(sessionStorage.getItem('userInfo') || '{}'); + const cachedData = sessionStorage.getItem(`compLibs${userInfo.userId}`); + + if (cachedData) { + const componentData = JSON.parse(cachedData); + addInitState(componentData); + } + }; + + // 手动刷新组件列表(重新请求 API) + const refreshCompList = async () => { try { const requests = [ { promise: getMyComponents(), key: 'myLibs' }, @@ -466,10 +477,8 @@ const Market: React.FC = ({ updateProjectComp }) => { res?.data.list.forEach(item => { item['fontCompType'] = 'complex'; }); - // 更新本地存储数据 obj[key] = res?.data.list || null; } - // 给协同组件添加一个后续处理数据时使用的类型 else if (key === 'teamLibs') { res.data.forEach(item => { item.children.forEach(v => { @@ -479,7 +488,6 @@ const Market: React.FC = ({ updateProjectComp }) => { obj[key] = res?.data || null; } else { - // 更新本地存储数据 res.data.forEach(item => { item.children.forEach(v => { v['fontCompType'] = 'normal'; @@ -488,26 +496,32 @@ const Market: React.FC = ({ updateProjectComp }) => { obj[key] = res?.data || null; } } - sessionStorage.setItem(`compLibs${userInfo.userId}`, JSON.stringify(obj)); - const componentData = JSON.parse(sessionStorage.getItem(`compLibs${userInfo.userId}`)); - addInitState(componentData); } catch (error) { console.error(`加载${key}失败:`, error); } } + + // 更新缓存 + sessionStorage.setItem(`compLibs${userInfo.userId}`, JSON.stringify(obj)); + // 更新组件列表状态 + addInitState(obj); + Message.success('组件库刷新成功'); } catch (error) { console.error('更新组件库失败:', error); + Message.error('组件库刷新失败'); } }; - + // 页面初始化时从缓存加载,projectComponentData 变化时更新显示状态 useEffect(() => { - getCompList(); + loadCompListFromCache(); }, []); - // 监听 Redux 中 projectComponentData 的变化,更新组件列表状态 + // 当项目组件数据变化时,更新组件的添加状态 useEffect(() => { - getCompList(); + if (projectComponentData) { + loadCompListFromCache(); + } }, [projectComponentData]); return ( @@ -529,7 +543,7 @@ const Market: React.FC = ({ updateProjectComp }) => {