Commit 93f7c30

authored

docs: add faq docs on typescript (#1042)

1 parent 671da08 commit 93f7c30Copy full SHA for 93f7c30

File tree

+30

-0

lines changed

+30

-0

lines changed

Lines changed: 4 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -24,4 +24,8 @@ exports.docs = [`
`24`	`24`	`title: 'How to fix "... is not a registered scale" error?',`
`25`	`25`	`slug: '/faq/registered-scale',`
`26`	`26`	`},`
	`27`	`+ {`
	`28`	`+ title: 'How to use react-chartjs-2 with TypeScript?',`
	`29`	`+ slug: '/faq/typescript',`
	`30`	`+ },`
`27`	`31`	`];`

Lines changed: 26 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,26 @@`
	`1`	`+---`
	`2`	`+slug: /faq/typescript`
	`3`	`+---`
	`4`	`+`
	`5`	`+# How to use react-chartjs-2 with TypeScript?`
	`6`	`+`
	`7`	`+TypeScript has extremely robust type inference capabilities and most of the time`
	`8`	`+we can enjoy type safety and autocompletion without having to do any extra work.`
	`9`	`+`
	`10`	+But occasionally types need to be set explicitly. They can be imported from `Chart.js`:
	`11`	`+`
	`12`	+```typescript
	`13`	`+import type { ChartData, ChartOptions } from 'chart.js';`
	`14`	+```
	`15`	`+`
	`16`	+...and then used with `options` and `data` props:
	`17`	`+`
	`18`	+```typescript
	`19`	`+interface LineProps {`
	`20`	`+ options: ChartOptions<'line'>;`
	`21`	`+ data: ChartData<'line'>;`
	`22`	`+}`
	`23`	+```
	`24`	`+`
	`25`	+The generic type being passed is a `ChartType` that can be one of the following values:
	`26`	+`'bar'`, `'line'`, `'scatter'`, `'bubble'`, `'pie'`, `'doughnut'`, `'polarArea'` or `'radar'`.

Comments

(0)