Functional component | Class Component |
1.A functional component is just a plain JavaScript function which accepts props as an argument and returns a React element. | 1.A class component requires you to extend from React.Component and create a render function which returns a React element. This requires more code |
2. you cannot use setState() in your component. | 2.you can use setState() in your component. |
3. It contains less lines of code | 3. It contains more lines of codes |
4. It accepts only props | 4. It accepts both props and state |
5. syntax import React from 'react'; import ReactDOM from 'react-dom'; function Welcome(props){ return <h1>Hello,{props.name}</h1> } ReactDOM.render(<Welcome />,document.getElementById('root')); | 5. syntax import React from 'react'; import ReactDOM from 'react-dom'; class Welcome extends React.Component{ render(){ return <h1>Hello,{this.props.name}</h1> } } ReactDOM.render(<Welcome />,document.getElementById('root')); |
Friday, May 29, 2020
Difference between Functional and Class Components in react.js ?
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment