๋ฐ˜์‘ํ˜•

ํ”„๋ก ํŠธ์—”๋“œ 22

[TypeScript] ์ œ๋„ค๋ฆญ ์ปดํฌ๋„ŒํŠธ (generic component) ์ •์˜ ๋ฐ ์‚ฌ์šฉ๋ฐฉ๋ฒ•

์ด ๊ธ€์€ ์›๊ธ€์„ ์ฐธ๊ณ ํ•˜์—ฌ ์ •๋ฆฌํ•œ ๋‚ด์šฉ์ž…๋‹ˆ๋‹ค. Definition TypeScript Generics๋Š” ์žฌ์‚ฌ์šฉ ๊ฐ€๋Šฅํ•œ ๊ตฌ์„ฑ์š”์†Œ๋ฅผ ์ƒ์„ฑํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ์ œ๊ณตํ•˜๋Š” ๋„๊ตฌ์ž…๋‹ˆ๋‹ค. generics๋Š” ํ”„๋กœ๊ทธ๋žจ์ด ์žฅ๊ธฐ์ ์œผ๋กœ ํ™•์žฅ๊ฐ€๋Šฅํ•  ๋ฟ๋งŒ ์•„๋‹ˆ๋ผ ์œ ์—ฐํ•  ์ˆ˜ ์žˆ๋„๋ก ๋ณด์žฅํ•ด์ค๋‹ˆ๋‹ค. Example # Props interface Props { renderItem: (item: T) => React.ReactNode; keyExtractor: (item: T) => string; data: T[]; } data: ์ œ๋„ค๋ฆญ ํƒ€์ž… T๋ฅผ ๋ฐ›์„ ๋ฐฐ์—ด ์š”์†Œ renderItem: ํƒ€์ž… T์˜ react ์š”์†Œ๋ฅผ ๋ฐ˜ํ™˜ํ•˜๋Š” ํ•จ์ˆ˜ keyExtractor: ํ‚ค๋ฅผ ์ถ”์ถœํ•˜๋Š” ํ•จ์ˆ˜ # Component ์ •์˜ const GenericList = ({ data,..

[Chart.js] line ์ฐจํŠธ border line ๊ตต๊ฒŒ ์ง€์ •ํ•˜๋Š” ๋ฐฉ๋ฒ•

Intro ์•ˆ๋…•ํ•˜์„ธ์š”. ์ด๋ฒˆ ์‹œ๊ฐ„์—๋Š” Chart.js์—์„œ line ์ฐจํŠธ border line ๊ตต๊ฒŒ ์ง€์ •ํ•˜๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•ด ์•Œ์•„๋ณด๋„๋ก ํ•˜๊ฒ ์Šต๋‹ˆ๋‹ค. How to do const options: ChartOptions = { // other options elements: { line: { borderWidth: 2, }, }, // other options }; borderWidth ์ˆซ์ž๋ฅผ ํฌ๊ฒŒ ์ง€์ •ํ•  ์ˆ˜๋ก border line ๊ตต๊ธฐ๊ฐ€ ๊ตต์–ด์ง‘๋‹ˆ๋‹ค :)

Library 2023.08.11
๋ฐ˜์‘ํ˜•