Andreas Roth
Andreas Roth
PostsComments
SSolidJS
Created by Andreas Roth on 9/16/2024 in #support
Cycles in dependency graph
That's what I thought... Thanks for chiming in anyways 🙂
4 replies
SSolidJS
Created by lawftyg on 9/15/2024 in #support
best way to update multiple children in a multi timer app?
Solid is still a declarative framework. You don't imperatively call functions on children. You pass data down, and let the children decide what they want to do. So your parant would manage the time and would pass the time value down to children and if children need to manipulate the time (like reset, stop, start etc.) you simply pass down functions from the parent to the child. https://playground.solidjs.com/anonymous/9d2a881b-f396-487e-ad93-35ea7f34673f
2 replies
SSolidJS
Created by hannus on 8/22/2024 in #support
How can I make createEffect in SolidJS execute only when the dependency variable changes, and not wh
Could also easily be wrapped into a "hook" so that internalSetValue isn't even available to the outside.
18 replies
SSolidJS
Created by hannus on 8/22/2024 in #support
How can I make createEffect in SolidJS execute only when the dependency variable changes, and not wh
(Maybe a bit late, but anyways): I think this pattern is a code smell. This directly points us to move the logic into the event handler... 
const [value, internalSetValue] = createSignal("");
function setValue(newValue: string) {
  localStorage.setItem("value", newValue);
  internalSetValue(newValue);
}

// ...
const [value, internalSetValue] = createSignal("");
function setValue(newValue: string) {
  localStorage.setItem("value", newValue);
  internalSetValue(newValue);
}

// ...
18 replies
SSolidJS
Created by Misery on 8/27/2024 in #support
Seemingly random hydration mismatches
The div/p thing is what causes these errors. When getting the plain html, the browser assumes that div inside of a p is an error, closes the p and opens a new div. Once solid hydrates it sees this, complains, and tries to fix it. So when you look in devtools it will be correct. If you disable JS or only look at the returned static html, you will see another structure.
6 replies
SSolidJS
Created by Max on 3/27/2023 in #support
function prop destructure
No it's not... What if someone uses the component in a way that changes the accessor? 
function Inner(props: { n: () => number }) {
  // Only takes the first version of the accessor
  const n = props.n;

  return <button>{n()}</button>;
}

function GoodOuter() {
  const [n, setN] = createSignal(0);

  // Works because it is always the same accessor
  return <Inner n={n} />;
}

function BadOuter() {
  const [a, setA] = createSignal(0);
  const [b, setB] = createSignal(100);

  const [useA, setUseA] = createSignal(true);

  return (
    <div>
      <button onClick={() => setUseA(!useA())}>Toggle</button>
      <Inner n={useA() ? a : b} />
    </div>
  )
}
function Inner(props: { n: () => number }) {
  // Only takes the first version of the accessor
  const n = props.n;

  return <button>{n()}</button>;
}

function GoodOuter() {
  const [n, setN] = createSignal(0);

  // Works because it is always the same accessor
  return <Inner n={n} />;
}

function BadOuter() {
  const [a, setA] = createSignal(0);
  const [b, setB] = createSignal(100);

  const [useA, setUseA] = createSignal(true);

  return (
    <div>
      <button onClick={() => setUseA(!useA())}>Toggle</button>
      <Inner n={useA() ? a : b} />
    </div>
  )
}
We should never break reactivity just because it works in some cases... If you can break the component by "using it wrong", the component implementation is broken
21 replies
SSolidJS
Created by <Alterion.Dev> on 12/13/2022 in #support
Virtual Scrolling with animation and dynamic loading
I suggest not using overflow: hidden, but overflow scroll with scroll snap. You can then do some css shenanigangs to hide the scrollbar visually, but the setup will automatically work with horizontal mouse wheels, trackpads or touch screens.
5 replies