[오류리뷰] rc-tree(2) : type

rc tree에 대한 함수 type.

const switcherIcon = (extension) => {
  let icon = extension.title.toString().split(".").pop();
  const isDirectory = extension.data.children;
  if (isDirectory) {
    icon = extension.expanded ? "openFolder" : "closedFolder";
  } else if (!extension.title.includes(".")) {
    icon = "draft";
  }
  const iconSvg = (
    <img src={`/svg/${icon}.svg`} className={styles.fileIcon} />
  );

  return iconSvg;
};

원래 이런식으로 만들었는데, 매개변수 extension에 타입이 없다고(any) 오류가 생겼다. 그래서 타입을 다 만들어야 되나라고 생각했는데, 다른 사람 코드를 참고해보니까 rc tree 라이브러리에 TreeProps라는 옵션이 있었다. 그대로 import.

import Tree, { TreeProps } from "rc-tree";

const switcherIcon: TreeProps["switcherIcon"] = (extension) => {
  let icon = extension.title!.toString().split(".").pop();
  const isDirectory = extension.data!.children;
  if (isDirectory) {
    icon = extension.expanded ? "openFolder" : "closedFolder";
  } else if (!extension.title!.toString().includes(".")) {
    icon = "draft";
  }
  const iconSvg = (
    <img src={`/svg/${icon}.svg`} className={styles.fileIcon} />
  );

  return iconSvg;
};

그래서 undefined일 수도 있다는 부분에 상황에 맞게 !를 주었는데 else if 쪽 조건 includes(”.”)에 오류가 생긴 것이다. number 형식에 includes 속성이 없다고.. 당연히 타이틀을 다 string화 되는 줄 알았는데 아니었나보다. 그래서 조건에 toString()함수를 붙여서 string으로 만들고 includes()함수를 진행시켰다. ⇒ 해결완료