RealGrid2 튜토리얼
React Component 튜토리얼
그리드 렌더러 적용

그리드 렌더러 적용 하기

그리드에서 렌더러 기능을 사용하는 방법은 렌더러를 적용할 컬럼 태그 renderer props에 적용하고자 하는 renderer 속성을 전달하면 해당 기능을 사용 하실 수 있습니다.

아래는 간단하게 이미지렌더러를 적용한 예시 코드 입니다.

return (
    <div style={{ width: "100%", height: "550px"}}>
         <RealGridReact
            ref={gridRef}
            autoGenerateField={true}
            gridProps={{display: {rowHeight: 80}}}
            rows={[
                ["KRW"], ["USD"]
            ]}
        >
            <RGDataColumn
                fieldName='Monetary'
                renderer={{
                    type: 'image',
                    imageCallback: (grid: RealGrid.GridBase, cell: RealGrid.GridCell) => {
                        return `${cell.value}.png`
                    },
                    imageHeight: 50,
                }}
            />
        </RealGridReact>
    </div>
);

Renderer

렌더러 적용 방법은 이미지렌더러 예제에서 확인해보실 수 있습니다.