useState hooks and its functionality
Wisdom Okogho
Pharmacologist || Mult-niched Writer || Web Developer Proficient in HTML, CSS, JavaScript, React, Node js, Mongo DB, Firebase
React hooks are functions that enable developers to use state and other React features in functional components without having to use class components. Hooks were introduced in React 16.8 and have since become an essential tool for building modern React applications.
UseState -
As a part of the react library, there's a method call "useState" This hook allows you to add state to a functional component. It takes an initial value and returns an array with two items - the current state value and a function to update the state.
for example:
The image above is array destructuring of how useState is being used by developers. It brings out the real power of useState hook. The initial value of state("This is a functional component!") is stored in mssg and setMssg is the function to update the state.
More example below:
From the description above, the function app use the useState hook. Its initial value was set to "Yes" which is stored in "isImportant" and inorder to change the state to "No", the "setIsImportant" is altered. And automatically isImportant new state has change from yes to no.
Instead of hard coding values, you can simply use the useState hooks and make your changes. How cool is that?
My next technical writing article will talk about other hooks being used in React. I will probably throw more light on useState. So don't miss out.