[React] 글자 수 이상일 때 '...' 처리하기

 

 글자 수 초과 시 ... 처리하는 방법

조건을 줘서 substr 메서드를 이용하면 간단하게 처리할 수 있다.

const truncate = (str, n) => {
  return str?.length > n ? str.substr(0, n - 1) + "..." : str;
};

위와 같이 truncate라는 함수를 만든 후 jsx, tsx에서 가져다 쓰면 된다.

<span>{truncate(movie.overview, 100)}</span>

그럼 100자 초과 시 나머지 글자를 자르고 "..."가 붙어서 원하는 대로 처리된다.