S
SolidJS•2y ago
bigmistqke

setting signal inside createRenderEffect

say I have the following code 
function Counter() {
  const [count, setCount] = createSignal(1);
  const [other, setOther] = createSignal(1);
  const increment = () => setCount(count() + 1);

  createRenderEffect(() => console.log("effect", other()));

  createRenderEffect(() => {
    setOther(count());
    console.log("render");
  });

  return (
    <button type="button" onClick={increment}>
      {count()}
    </button>
  );
}
function Counter() {
  const [count, setCount] = createSignal(1);
  const [other, setOther] = createSignal(1);
  const increment = () => setCount(count() + 1);

  createRenderEffect(() => console.log("effect", other()));

  createRenderEffect(() => {
    setOther(count());
    console.log("render");
  });

  return (
    <button type="button" onClick={increment}>
      {count()}
    </button>
  );
}
I assumed in the above example, first all the effects dependent of other would be run, so it would log after clicking 2 times 
effect 1
render
effect 2
render
effect 3
render
effect 1
render
effect 2
render
effect 3
render
but instead we get 
effect 1
render
render
effect 2
render
effect 3
effect 1
render
render
effect 2
render
effect 3
initially it is executed directly as it is declared, as expected, but then afterwards the effects will only run after the current effect is completed. I understand it's not ideal to set signals during effects, probably for these sort of things, but I wonder if there is an escape hatch. playground: https://playground.solidjs.com/anonymous/d4a6e547-9bd0-4b63-9e72-f47b25a16b01
Solid Playground
Quickly discover what the solid compiler will generate from your JSX template
3 Replies
jmp
jmp•2y ago
I'm not sure if this would work for your use case, but if you make "render" dependent on updates to other rather than updates to count, you'll get properly alternating effects and renders: https://playground.solidjs.com/anonymous/231201e1-546a-4621-9124-b345fea0caf9
Solid Playground
Quickly discover what the solid compiler will generate from your JSX template
jmp
jmp•2y ago
I guess I'm not sure what dependency graph you have in mind? do you want "render" to run every time other is updated or only when other is updated by count? If the latter, maybe there's another way to express that dependency graph
bigmistqke
bigmistqkeOP•2y ago
mm, I went in another direction for the api for now because it felt a bit hacky... if I decide to do the original api I will check out if that could be the fix

Did you find this page helpful?