diff --git a/client/packages/lowcoder/src/comps/hooks/localStorageComp.ts b/client/packages/lowcoder/src/comps/hooks/localStorageComp.ts index 96f1ca465..e3ce4633f 100644 --- a/client/packages/lowcoder/src/comps/hooks/localStorageComp.ts +++ b/client/packages/lowcoder/src/comps/hooks/localStorageComp.ts @@ -13,21 +13,28 @@ const APP_STORE_NAMESPACE = "lowcoder_app_local_storage"; const LocalStorageCompBase = withViewFn( simpleMultiComp({ values: stateComp({}) }), (comp) => { - const originStore = localStorage.getItem(APP_STORE_NAMESPACE) || "{}"; - let parseStore = {}; - try { - parseStore = JSON.parse(originStore); - } catch (e) { - log.error("application local storage invalid"); - } - + // add custom event listener to update values reactively useEffect(() => { - const value = comp.children.values.value; - if (!isEqual(value, parseStore)) { - log.info(value, parseStore); - comp.children.values.dispatchChangeValueAction(parseStore); - } - }, [parseStore]); + const handler = () => { + try { + const raw = localStorage.getItem(APP_STORE_NAMESPACE) || "{}"; + const parsed = JSON.parse(raw); + comp.children.values.dispatchChangeValueAction(parsed); + } catch (e) { + log.error("Failed to parse localStorage:", e); + } + }; + + // Add listener on mount + window.addEventListener("lowcoder-localstorage-updated", handler); + + // Run once on mount to initialize + handler(); + + return () => { + window.removeEventListener("lowcoder-localstorage-updated", handler); + }; + }, []); return null; } @@ -62,6 +69,8 @@ LocalStorageComp = withMethodExposing(LocalStorageComp, [ parseStore[key] = value; localStorage.setItem(APP_STORE_NAMESPACE, JSON.stringify(parseStore)); comp.children.values.dispatchChangeValueAction(parseStore); + + window.dispatchEvent(new CustomEvent("lowcoder-localstorage-updated")); } catch (e) { localStorage.setItem(APP_STORE_NAMESPACE, "{}"); } @@ -83,6 +92,9 @@ LocalStorageComp = withMethodExposing(LocalStorageComp, [ delete parseStore[key]; localStorage.setItem(APP_STORE_NAMESPACE, JSON.stringify(parseStore)); comp.children.values.dispatchChangeValueAction(parseStore); + + // Trigger update + window.dispatchEvent(new CustomEvent("lowcoder-localstorage-updated")); } catch (e) { localStorage.setItem(APP_STORE_NAMESPACE, "{}"); } @@ -98,6 +110,9 @@ LocalStorageComp = withMethodExposing(LocalStorageComp, [ execute: (comp) => { localStorage.removeItem(APP_STORE_NAMESPACE); comp.children.values.dispatchChangeValueAction({}); + + // Trigger update + window.dispatchEvent(new CustomEvent("lowcoder-localstorage-updated")); }, }, ]);