리액터는 MobX에서 제공하는 중요한 개념 중 하나입니다. 리액터는 옵저버 기반의 반응을 구현하는 방법을 제공하여 MobX 스토어의 상태가 변경될 때 자동으로 반응할 수 있도록 도와줍니다.

리액터는 MobX의 autorun 함수를 사용하여 정의됩니다. autorun 함수는 의존하는 MobX 관찰 가능한 객체나 메서드를 제공하면, 해당 객체나 메서드가 변경될 때마다 자동으로 실행되는 함수를 생성합니다. 이렇게 하면 상태 변경에 반응하여 원하는 작업을 수행할 수 있습니다.

간단한 예제를 통해 MobX의 리액터를 이해해보겠습니다.

import { autorun, observable } from 'mobx';

const counter = observable({
  count: 0,
});

autorun(() => {
  console.log(`Count: ${counter.count}`);
});

counter.count = 1;
counter.count = 2;

위의 예제에서 counter 객체는 count라는 속성을 가지며, observable 함수로 관찰 가능한 객체로 만들어져 있습니다. 그리고 autorun 함수를 사용하여 의존성을 설정하고, 의존하는 객체나 메서드가 변경될 때마다 실행되는 함수를 정의합니다. 이 함수는 간단히 현재 count 값을 콘솔에 출력하는 역할을 합니다.

위의 예제를 실행하면 count가 1로 바뀌고, 다시 2로 바뀌는 과정에서 autorun 함수에 정의된 함수가 실행되어 Count: 1과 Count: 2가 콘솔에 출력됩니다.

리액터를 사용하면 상태의 변화에 대해 실시간으로 반응하고 애플리케이션을 업데이트하는 데 도움을 줍니다. 이를 통해 상태 관리를 더욱 간편하게 할 수 있습니다.

더 많은 정보를 알고 싶다면 MobX 공식 문서를 참조하세요.