From the course: React Foundations by Pearson

Unlock this course with a free trial

Join today to access over 25,500 courses taught by industry experts.

Lab solution: Hooks

Lab solution: Hooks

Right, well, I'm going to lead you through the solution code now for Lab 5, looking at hooks. So I guess I'll just run through the browser just to remind you what it looks like, and then we'll actually run through the code together. So this is what the page looks like. We have a library component, which decides whether to display book and film information as tables or as list items. I also have a like panel displayed at the bottom, which uses React State to keep track of the like counter and to allow me to reset it. There's also an effect. So in the like panel component, every time the like counter changes, it displays a message on the console to say the light counter has changed. So we need to look at the console to see that. So here's the console window. Every time I change the light count there's an effect which says oh the light count has changed and it displays the value and the timestamp when it changed. So when I reset it to zero you can see it's now been reset to zero and then…

Contents