SYIDAX / DATA GRID

셀 툴팁

잘린 값이나 보조 설명을 셀 위에 표시합니다.

셀 툴팁샘플 주문 데이터

120 rows

Grid를 불러오는 중입니다…

옵션

아래 항목을 바꾸면 Grid와 코드에 바로 반영됩니다.

제품 열 너비 (px)

최근 결과

Atlas Sensor 같은 제품명 셀 위에 마우스를 올리고 잠시 기다리세요. 헤더가 아닌 실제 데이터 셀을 가리킵니다.

코드 보기

현재 미리보기

열이 좁아 잘린 제품 이름이나 보조 정보를 마우스를 올렸을 때 보여 주는 기능입니다.

제품 셀 가리키기
Atlas Sensor 같은 제품명 셀 위에 마우스를 올리고 잠시 기다리세요. 헤더가 아닌 실제 데이터 셀을 가리킵니다.
보조 내용 읽기
나타나는 툴팁의 제품명이 셀의 주문과 맞는지 확인하세요. 다른 제품으로 옮기면 내용도 달라집니다.
열 너비와 비교
제품 헤더 경계를 드래그해 열을 좁힌 후 다시 마우스를 올려보세요. 셀에서 잘린 값도 보조 표시로 확인할 수 있습니다.

확인할 결과

해당 행의 제품명이 툴팁으로 표시됩니다.

현재 제품 열은 tooltipField가 product로 설정되어 있습니다. 중요한 정보는 툴팁에만 숨기지 말고 터치·키보드 사용자도 읽을 수 있게 제공하세요.

메서드1

메서드 / 인수	반환 타입	설명
target: { rowIndex: number; field: string; displayedText?: string; isOverflowing?: boolean }	`Promise<string>`	Resolve the tooltip text for a cell (overflow + tooltipField/tooltipValueGetter aware).

ColumnDef3

ColumnDef	타입 / 필수 여부	설명
	`string`선택	tooltip shown on header hover/focus. When omitted, a truncated (overflowing) header still shows its full text as a tooltip.
	`GridFieldPath<TData>`선택	Row field used as tooltip text before overflow fallback.
	`GridCallback<[ValueGetterParams<TData, TValue, TContext>], unknown> \| string`선택	Computed tooltip text. Wins over `tooltipField`.