April 2020
Intermediate to advanced
716 pages
18h 55m
English
In the checkout form, we will have fields for collecting the customer's name and email address. To add these text fields to the Checkout component, we will use the following code.
mern-marketplace/client/cart/Checkout.js:
<TextField id="name" label="Name" value={values.checkoutDetails.customer_name} onChange={handleCustomerChange('customer_name')}/><TextField id="email" type="email" label="Email" value={values.checkoutDetails.customer_email} onChange={handleCustomerChange('customer_email')}/><br/>
When the user updates the values in these two fields, the handleCustomerChange method will update the relevant details in the state. The handleCustomerChange method is defined as follows.
mern-marketplace/client/cart/Checkout.js ...
Read now
Unlock full access