반응형
[Next.js, ts, js] 객체의 values 길이 제한을 둬 "[values 글자 수 제한] + ... "으로 필터링하기
// 제한하고싶은 글자수 길이
let MAXLENGTH = 15;
// 일반 함수식 + any타입을 제거하면 js에서 사용가능
export const dataLengthFilter: any = (list: any) => {
for (let i = 0; i < list.length; i++) {
for (const key in list[i]) {
const values = list[i][key];
if (values.length > MAXLENGTH) {
console.log(i, key, values.slice(0, MAXLENGTH-1));
list[i][key] = values.slice(0, MAXLENGTH-1) + "...";
}
}
}
return list;
};
1. 위 코드를 사용하면 객체의 values가 너무 길 경우 적절한 함수로 처리해줄 수 있다.
2. 예를 들어 123456789123456789일때 12345678912345...으로 줄여준다.
3. 이는 Front-end에서 데이터를 표시할 때 데이터가 너무 길 경우 CSS속성을 변경하지 않고 해결할 수 있다.
4. word-break속성 (break-all: 문자를 강제로 줄바꿈, normal: 일반적인 규칙으로 줄바꿈, kepp-all: 문자 쌍 사이에 줄바꿈이 금지)을 주지않고 함수로 처리한다.
반응형
'언어 > Javascript, Typescript' 카테고리의 다른 글
[js, ts] 정규식을 이용하여 공백, 전화번호에서의 -, 특수문자 제거 함수 (0) | 2023.04.07 |
---|---|
[js, Next.js] 웹페이지 접속기기 종류 체크(모바일, 웹) (0) | 2023.04.06 |
[js] 배열 .filter() 메소드 ( 배열, 객체에서 필터링 ) (0) | 2023.03.30 |
AJAX란?, AJAX사용방법 (0) | 2023.03.29 |
[js] 현재 페이지 URL 관련 정보를 가져오기 (0) | 2023.03.28 |
댓글