Author - StudySection Post Views - 61 views
React Js

Hooks in React Js

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

  1. useEffect hook
  2. 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.

Leave a Reply

Your email address will not be published. Required fields are marked *

fiteesports.com rivierarw.com cratosroyalbet betwoon grandpashabet grandpashabet giriş deneme bonusu veren siteler casino siteleri