State vs Props in React
Manikandan K
Posted on February 1, 2024
State
- The state is a built-in React object / that is used to contain data or information /about the component
- State is Mutable (changeable)
import React, { useState } from "react";
const App = () => {
// here defined name as a state variable
const [name, setName] = useState('Manikandan');
return <h2>Hi, I am {name}. </h2>
}
export default App;
Props
- Props allow you to pass data / from one component to other components / as an argument.
- Props are immutable (not changeable)
import React, { useState } from "react";
const App = () => {
const [name, setName] = useState('Manikandan');
// here pass the (name state) to the Display component as props
return <Display name={name} />
}
const Display = (props) => {
// Here receive the name as props
// we can use (props) or ({name})
return <h2>Hi, I am {props.name}. </h2>
}
export default App;
💖 💪 🙅 🚩
Manikandan K
Posted on February 1, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
