When defining react components using typescript we can write something like:
class SomeComponent extends React.Component<PropInterface, StateInterface> {
// ...
}
Is there a way do the equivalent using jsdoc annotations and have props type-checked.
You can use most JSDoc type syntax and any TypeScript syntax, from the most basic like string to the most advanced, like conditional types.
I prefer following form (es2015 + @types/react):
/**
* @typedef {object} Props
* @prop {string} className
* @prop {number} numberProp
*
* @extends {Component<Props>}
*/
export default class SomeComponent extends Component {
render() {
return (
<div className={this.props.className}>
{this.props.numberProp}
</div>
);
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With