[javascript] Svelte에서 상태 관리를 어떻게 할 수 있나요?

Svelte에서 상태를 관리하는 가장 기본적인 방법은 let 키워드를 사용하여 변수를 선언하는 것입니다. 이 변수는 컴포넌트의 상태가 됩니다. 예를 들어, 다음은 count라는 상태 변수를 가지는 컴포넌트의 예입니다.

<script>
  let count = 0;

  function increment() {
    count += 1;
  }

  function decrement() {
    count -= 1;
  }
</script>

<button on:click={increment}>증가</button>
<p>현재 : {count}</p>
<button on:click={decrement}>감소</button>

이 예제에서 count는 상태 변수로 선언되었습니다. increment 함수는 count를 1 증가시키고, decrement 함수는 1 감소시킵니다. 버튼을 클릭할 때마다 해당 함수가 실행되며, 상태 변수인 count의 값이 변경됩니다. 변경된 값은 화면에 바로 반영되어 현재 값이 표시됩니다.

만약 여러 개의 상태를 관리해야 한다면, let 키워드를 사용하여 해당 변수들을 선언하고 각각의 상태를 업데이트하면 됩니다.

또 다른 상태 관리 방법으로는 Svelte Store를 사용하는 것이 있습니다. Store는 컴포넌트 사이에서 데이터를 공유하는 데 사용되는 중앙 집중화된 상태 관리 도구입니다.

이외에도 Svelte에서는 다양한 상태 관리 라이브러리와 훅을 활용하여 상태를 보다 효율적으로 관리할 수 있습니다. Svelte는 상태 관리에 대한 다양한 선택지를 제공하기 때문에, 프로젝트에 가장 효율적인 방법을 선택할 수 있습니다.