diff --git a/docs/jsx/tsx.md b/docs/jsx/tsx.md index c7d28b793..713527df1 100644 --- a/docs/jsx/tsx.md +++ b/docs/jsx/tsx.md @@ -86,6 +86,22 @@ const bar: React.ReactElement = ; // > Of course you can use this as a function argument annotation and even React component prop member. +### React JSX Tip: Generic components +There's no syntax in JSX to apply generic parameters to a generic component; a type and constructor must first be created in Typescript proper. Example: + +```ts +/** A generic component */ +type SelectProps = { items: T[] } +class Select extends React.Component, any> { } + +/** Specialize Select to use with strings */ +interface IStringSelect { new (): Select } ; +/** Constructor function - must be capitalized for JSX +const StringSelect = Select as IStringSelect; + +/** Usage */ +const Form = ()=> ; +``` ## Non React JSX TypeScript provides you with the ability to use something other than React with JSX in a type safe manner. The following lists the customizability points, but note that this is for advanced UI framework authors: