saladsoft-primiive

프로젝트 설명

이 프로젝트는 많이 사용하는 컴포넌트 및 유틸리티를 모아놓은 프로젝트입니다.

설치 방법

다음 명령어를 사용하여 프로젝트를 설치할 수 있습니다.

npm install saladsoft-primitive@latest

설정방법

root의 index.tsx파일에 다음과 같이 코드 삽입.

import { CustomProvider } from 'saladsoft-primitive';
import { LocalStore } from 'stores/LocalRootStore';

<CustomProvider localStores={LocalStore}>
//...
</CustomProvider>

CustomProvider에는 기본적으로 UIStore만 포함하고 있으므로, 프로젝트 내에서 생성한 localStore를 사용하기 위해서는 프로젝트 내부에서 생성한 LocalStore를 전달 하여야 합니다.

import { IRootStore } from 'saladsoft-primitive'; import LocationStore from './LocationStore';

import LocationStore from './LocationStore';

interface ILocalStore {
  locationStore: LocationStore;
}

const LocalStore: ILocalStore = {
  // 로컬에서 생성한 스토어
  locationStore: new LocationStore(),
};

export { ILocalStore, LocalStore };

이후, 로컬에 storeHelper파일을 만든후 다음과 같이 생성함.

import { IRootStore, useStore } from 'saladsoft-primitive';
import { ILocalStore } from './LocalRootStore';

const useStoreWrapper = () => {
  return useStore<IRootStore & ILocalStore>();
};

export { useStoreWrapper };

마지막으로,

  const { uiStore, locationStore } = useStoreWrapper();

다음과 같이 사용 가능합니다.