Skip to Main Content
Advanced TypeScript Programming Projects
book

Advanced TypeScript Programming Projects

by Peter O'Hanlon
July 2019
Intermediate to advanced content levelIntermediate to advanced
416 pages
10h 6m
English
Packt Publishing
Content preview from Advanced TypeScript Programming Projects

Creating a tabbed user interface

Before we add in our navigation elements, we are going to create the components that we will link to when the user clicks on one of the links. We will start with AddAddress.tsx, which we will add code into to add an address. We start off by adding the class definition:

export class AddAddress extends React.Component<any, IAddress> {}

The default state for our component is an empty IAddress, so we add the definition for it, and set the component state to our default:

private defaultState: Readonly<IAddress>;constructor(props:any) {  super(props);  this.defaultState = {    Line1: '',    Line2: '',    Line3: '',    Line4: '',    PostalCode: '',    ServerID: '',  };  const address: IAddress = this.defaultState; this.state = address; ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Start your free trial

You might also like

Learn TypeScript 3 by Building Web Applications

Learn TypeScript 3 by Building Web Applications

Sebastien Dubois, Alexis Georges

Publisher Resources

ISBN: 9781789133042Supplemental Content