46 lines
		
	
	
		
			805 B
		
	
	
	
		
			Markdown
		
	
	
	
	
	
			
		
		
	
	
			46 lines
		
	
	
		
			805 B
		
	
	
	
		
			Markdown
		
	
	
	
	
	
| ---
 | |
| title: Create a Stateful Component
 | |
| ---
 | |
| ## Create a Stateful Component
 | |
| 
 | |
| #### Hint 1 :
 | |
| ```JSX
 | |
| class StatefulComponent extends React.Component {
 | |
|   constructor(props) {
 | |
|     super(props);
 | |
|     // initialize state here
 | |
|         // "This" area may be a good place to use "dot" notation.
 | |
|         // dont forget to describe "name" property inside the state and assign your name to a property of "name". 
 | |
|   }
 | |
|   render() {
 | |
|     return (
 | |
|       <div>
 | |
|         <h1>{this.state.name}</h1>
 | |
|       </div>
 | |
|     );
 | |
|   }
 | |
| };
 | |
| ```
 | |
| 
 | |
| ## Solution 
 | |
| ```JSX
 | |
| class StatefulComponent extends React.Component {
 | |
|   constructor(props) {
 | |
|     super(props);
 | |
|     // initialize state here
 | |
|     
 | |
|     this.state = {
 | |
|       name : "Name"
 | |
|     }
 | |
| 
 | |
|   }
 | |
|   render() {
 | |
|     return (
 | |
|       <div>
 | |
|         <h1>{this.state.name}</h1>
 | |
|       </div>
 | |
|     );
 | |
|   }
 | |
| };
 | |
| ```
 |