[오류리뷰] monaco editor : 폰트 크기 변경 함수

Yunseok Choi·2024년 3월 27일

EARTH-IDE-N 프로젝트

목록 보기
5/9

1️⃣ 문제상황

monaco editor의 폰트사이즈를 변경하는 버튼을 만들려고 상태관리 파일에 변수를 생성해서 넣었는데 계속 오류가 났다. 오류를 봐도 '{ codeFontSize: number; }' 형식은 'number' 형식에 할당할 수 없습니다. 라고 나오는데 이해가 가지 않았다.

2️⃣ 해결방안

그리고 잘 보니 중괄호를 넣지 않고 그냥 변수이름만 넣으면 됐다… 오류를 유심히 보면 답이 있다.

3️⃣해결

<Editor
  options={{
    selectOnLineNumbers: true,
    fontSize: codeFontSize,
  }}
/>

codeFontSize를 변경하는 버튼을 만들었는데, 최대값과 최소값을 만들고 싶었다.

그래서 inc에 Math.min을, dec에 Math.max를 줘서 최대, 최대소값을 고정하였다.

[Zustand]

incCodeFontSize: () =>
    set((state) => ({ codeFontSize: Math.min(state.codeFontSize + 1, 24) })),
decCodeFontSize: () =>
    set((state) => ({ codeFontSize: Math.max(state.codeFontSize - 1, 12) })),

Math.min,max의 작동원리 : 괄호 안의 두 값을 비교해서 min은 작은 값을 반환하고, max는 큰 걸 반환하는 식으로 동작한다.

profile
이용자와 서비스를 하나로 만드는 개발자, Hermann입니다.

0개의 댓글