Learn React with TypeScript 3

Optional props

Interface props can be optional, as we discovered in Chapter 1, TypeScript Basics. So, we can also use this mechanism to add optional props to a React component.

Let's add some optional props to allow the button captions to be configurable on our confirmation component:

1. Add some additional optional props called cancelCaption and okCaption to our interface:

interface IProps {  title: string;  content: string;  cancelCaption?: string;  okCaption?: string;}

We put a ? before the type annotation to denote that the prop is optional. Note also that we don't get a compilation error in App.tsx, where we reference, Confirm because we are not required to enter these as attributes on Confirm.

2. Let's reference these props in our JSX now, ...