ReactJs is component based. In last post we learn how to create component in reactjs In react we develop basic components and then adds them then again
we can adds these component and make a complex ui. In Reactjs we controls the data flow with
the help of state and props . With the help of state and props we can render dynamic data in
components
# Understanding ReactJS Props
1. In ReactJS we use props to send data to components.
2. In ReactJS every component is treated as a pure javascript function.
3. In ReactJS props are equivalent to parameters of a pure javascript function.
4. Props are immutable. Because these are developed in the concept of pure functions.
In pure functions we cannot change the data of parameters. So, also cannot change the data of a prop in ReactJS.
Now we will create props example in reactJs.
In App.js part we will pass data to component. We have two component here one function component(User/USer.js) and another class based component (Profile/Profile.js). In App.js we will reuse our component
App.js
import React from 'react';
const user = (props) =>{
return<p>I am {props.name} and my salary is {props.salary}</p>
};
export default user;
Class based Component : In class base Component we can get value from props using this keyword .
Profile.js
import React from "react";
class Profile extends React.Component {
render(){
return<p>highest education is {this.props.education} and works as {this.props.job}</p>;
}
};
export default Profile;
