그리드 준비와 첫 행 표시

gridReady는 createGrid 직후, firstDataRendered는 첫 행이 화면에 그려진 뒤(datasource는 첫 블록 도착 뒤) 한 번 발생하며, 모든 프레임워크 래퍼에서 씁니다.

두 이벤트는 그리드가 준비된 때를 알려 줍니다. 보기 되살리기, 컬럼 너비를 내용에 맞추기, 주소의 행으로 스크롤하기 같은 코드를 둘 자리입니다.

이벤트	시점	내용
gridReady	createGrid가 돌아온 직후 한 번(다음 줄에서 등록해도 받음)	{ api }
firstDataRendered	첫 데이터 행이 그려질 때 한 번(datasource는 첫 블록 도착 뒤)	{ rowCount }

const grid = createGrid(el, { columns, datasource });
grid.on('gridReady', () => grid.setState(savedView));
grid.on('firstDataRendered', () => {
  grid.autoSizeColumns();                                   // the columns fit what is on screen
  const row = Number(new URLSearchParams(location.search).get('row'));
  if (row) grid.scrollToRow(row);                           // ?row=120 from a link
});

래퍼에서

프레임워크	gridReady	firstDataRendered
React	onGridReady	onFirstDataRendered
Vue	@grid-ready	@first-data-rendered
Angular	(gridReady)	(firstDataRendered)
Svelte	onGridReady	onFirstDataRendered

그 밖의 새 이벤트: cellNoteChange, calculatedColumnsChange, detailToggleAll — 이벤트를 보세요.