[Solid] Syntax | 02. Effect

Effect는 signal의 값이 바뀔때 마다 실행하는 동작을 구현합니다.

createEffect( )함수를 통해 사용할 수 있습니다.

// createEffect를 사용하기 위해 먼저 불러와야 합니다.
import { createEffect } from 'solid-js';

// signal값이 변할 때마다 prop으로 받은 함수를 실행합니다.
createEffect( function );

아래 예시는 버튼을 누를 때 마다 누른 횟수를 출력해주는 코드입니다.

import { createSignal, createEffect } from 'solid-js';

function App() {
  // count signal을 선언합니다.
  const [count, setCount] = createSignal(0);
  
  // count signal 값이 달라질 때마다 그 값을 출력하는 함수를 선언합니다.
  createEffect(() => {
    console.log("The count is now", count());
  });

  // 버튼은 누를 때마다 signal 값이 증가하도록 합니다.
  return <button onClick={() => setCount(count() + 1)}>Click Me</button>;
}