SlideShare a Scribd company logo

React js t5 - state

•
•
Jainul Musani
Jainul Musani

State in React is a JavaScript object that contains private data for a component. The state data can be used to render a component and is initialized in the constructor method. For example, a Hello component defines a msg property in its state that is rendered in an h1 tag, displaying the message "Hello, RTDL - Tutorials!" on the page.

Related slideshows

React-JS Component Life-cycle Methods
React-JS Component Life-cycle MethodsReact-JS Component Life-cycle Methods
React-JS Component Life-cycle Methods
 
React and redux
React and reduxReact and redux
React and redux
 
Introduction to React Hooks
Introduction to React HooksIntroduction to React Hooks
Introduction to React Hooks
 
1 of 1
Download to read offline
ReactJs : Tutorial-05-State in ReactJs What is State in React JS? A state is a JavaScript object similar to props that have data to be used with the reactjs render. The state data is a private object and is used within components inside a class. Components as functions test.jsx import React from 'react'; import ReactDOM from 'react-dom'; class Hello extends React.Component { constructor(props) { super(props); this.state = { msg: "Hello, RTDL - Tutorials!" } } render() { return <h1>{this.state.msg}</h1>; } } export default Hello; index.jsx import React from 'react'; import ReactDOM from 'react-dom'; import Hello from './test.jsx'; ReactDOM.render( <Hello />, document.getElementById('root') );

More Related Content

React js t5 - state

  • 1. ReactJs : Tutorial-05-State in ReactJs What is State in React JS? A state is a JavaScript object similar to props that have data to be used with the reactjs render. The state data is a private object and is used within components inside a class. Components as functions test.jsx import React from 'react'; import ReactDOM from 'react-dom'; class Hello extends React.Component { constructor(props) { super(props); this.state = { msg: "Hello, RTDL - Tutorials!" } } render() { return <h1>{this.state.msg}</h1>; } } export default Hello; index.jsx import React from 'react'; import ReactDOM from 'react-dom'; import Hello from './test.jsx'; ReactDOM.render( <Hello />, document.getElementById('root') );