No Data 텍스트

March 10, 2021 · View on GitHub

No Data 텍스트는 데이터가 존재하지 않을 때 "No data to display" 같은 텍스트를 보여주는 옵션이다.

image

텍스트 변경

기본 텍스트 값은 "No data to display"이다. 다국어 처리 또는 문구를 변경하고 싶은 경우 options.lang.noData를 사용한다.

const options = {
  lang: {
    noData: '😭No Data!!😭',
  },
};

결과는 다음과 같다.

image

theme

현재 제공되고 있는 No Data 텍스트 테마 옵션은 다음과 같다.

interface NoDataTheme {
  fontSize?: number;
  fontFamily?: string;
  fontWeight?: string | number;
  color?: string;
}
이름타입설명
fontSizestring폰트 크기
fontFamilystring폰트 종류
fontWeightnumber | string폰트 가중치, 굵기
colorstring색상

간단한 예시로 텍스트의 색상을 변경해보겠습니다.

const options = {
  theme: {
    noData: {
      fontSize: 30,
      fontFamily: 'Verdana',
      fontWeight: 'bold',
      color: '#3ee',
    },
  },
};

해당 옵션을 적용한 결과는 다음과 같다.

image