Frontend/SolidJS
[Solid] Syntax | 02. Effect
Rayi
2024. 6. 20. 15:28
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>;
}
728x90