From the course: Building React and Django Apps

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Creating a higher-order component with React

Creating a higher-order component with React

From the course: Building React and Django Apps

Start my 1-month free trial

Creating a higher-order component with React

“

- We have form field validation on the back end. Let's add it to the front end with a higher-order component. The higher-order component maintains its own state, which is the error and it provides a field validation method. Simply checking for an empty field, and sending the appropriate error message, and if there's no error, clearing that message. Afterward, it propagates this change up through the onUpdate property of the wrapped component. When we render it, then we are substituting its update callback with our validate callback. And we pass through the other properties and below that, we display any error message. On the checkout page, we import the higher-order component and we create a new component using it. Then, in the render method, we find the form fields and we substitute form field with validated field. Now, let's run the dev server. Add an item to the checkout. And if we enter something here, we…

Contents