⯁ 𝓥𝓪𝓵𝓮𝓻𝓲𝓮
⯁ 𝓥𝓪𝓵𝓮𝓻𝓲𝓮
SSolidJS
Created by ⯁ 𝓥𝓪𝓵𝓮𝓻𝓲𝓮 on 11/10/2024 in #support
how to manage global signals interacting with other global signals properly?
Im an ex react dev (pre-nextjs takeover) and have been out of the game for a while. came back to learn solid as it appears to solve my then frustrations with react. Specifically, the crux of this question: handling of global state. My very basic understanding is to use signals simply outside of component scope. and contexts for more complex interactions. My issue however, begins when attempting to do something like the following: - have a globally scope signal that tracks the data in a popup. - want the popup to animate disappearing when the signal goes null, and as such, need the last known non null state. - create a signal that tracks the last non-null data so it can be rendered animating away. - create an effect like the following:
const [popup_data, set_popup_data] = createSignal(null);
const [last_popup_data, set_last_popup_data] createSignal(null);

createEffect(() => {
if (popup_data() !== null) {
set_last_popup_data(popup_data());
}
});
const [popup_data, set_popup_data] = createSignal(null);
const [last_popup_data, set_last_popup_data] createSignal(null);

createEffect(() => {
if (popup_data() !== null) {
set_last_popup_data(popup_data());
}
});
- this results in a (mostly understandable) warning about the effect not being able to be disposed of properly. I understand that it is global, and, as such, wont be disposed of (like an effect in a component will be). This is my intention, and the presence of this warning tells me im likely approaching things non idiomatically. What is the better (or- more "solid.js") approach to a system where one global signal needs to have an effect on another global signal? I can think of a few solutions but they all feel like workarounds. for example, placing all the global effects inside the unchanging root component.
17 replies