Hooks are used to manage the state of the project. We can use useState. It gives a mechanism to use state and other React functionality without writing a class. Hooks are only worked in the react component, not inside the class.
How to import hook
import React, { useState } from "react";
Types of hooks
- useEffect hook
- useState
useEffect hook: UseEffect hook works as componentDidMount, it is mostly used on the page load like fetching data.
import React, { useEffect, useState } from "react";
function ListingDetail() {
useEffect(() => {
fetchListingDetails();
});
const fetchListingDetails = () => {
console.log(‘In fetchListingDetails method’);
};
}
useState hook: useState is used to manage the state of an object throughout the component. In the below example, I have initialized the count variable to 0 and increased the count value by one on every click, and set the variable with a new value. This count variable will be updated at every location in the component.
function ListingDetail() {
const [count, setCount] = useState(0);
return (
<>
<div>
<p>You clicked {this.state.count} times</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
</>
);
}
If you have skills in PHP programming and you want to enhance your career in this field, a PHP certification from StudySection can help you reach your desired goals. Both beginner level and expert level PHP Certification Exams are offered by StudySection along with other programming certification exams.
