ASP.NET Core 3 and React

Creating a Form component

Let's perform the following steps to create a generic Form component:

1. Create a new file called Form.tsx with the following import statements:

import { FC, useState } from 'react';import { PrimaryButton, gray5, gray6 } from './Styles';/** @jsx jsx */import { css, jsx } from '@emotion/core';

2. Let's define interface for the form field values:

export interface Values {  [key: string]: any;}

We haven't used an interface defined in this way before. This is called an indexable type.

An indexable type is where the index signature is defined rather than specific properties. The type in the square brackets defines the type for the keys in the object and the type after the colon defines the return type when indexed.

In our ...