SolidJSS
SolidJSโ€ข3y agoโ€ข
4 replies
anhvu0911

Reactivity with normal functions

I try the following: doubleCount is using createMemo while tripleCount is a normal anonymous function.

They work just fine, the value is updated accordingly. The tripleCount is like an accessor at this point.

- How can this work? Do signals simply re-trigger any functions that wrap it?
- What are the benefits of using createMemo over normal function like this?

https://playground.solidjs.com/anonymous/4da086d5-a747-42b1-a50d-7cf8241cde74

function Counter() {
  const [count, setCount] = createSignal(1);
  const doubleCount = createMemo(() => count() * 2)
  const tripleCount = () => count() * 3

  return (
    <>
    <button type="button" onClick={() => setCount(count() + 1)}>
     {count()}
    </button>
    <br/>
    x2: {doubleCount()}
    <br/>
    x3: {tripleCount()}
    </>
  );
}
Quickly discover what the solid compiler will generate from your JSX template
Was this page helpful?