1import React, { useState } from 'react';
2
3function Example() {
4 // Declare a new state variable, which we'll call "count"
5 const [count, setCount] = useState(0);
6 return (
7 <div>
8 <p>You clicked {count} times</p>
9 <button onClick={() => setCount(count + 1)}>
10 Click me
11 </button>
12 </div>
13 );
14}
1class NameForm extends React.Component {
2 constructor(props) {
3 super(props);
4 this.state = {value: ''};
5 this.handleChange = this.handleChange.bind(this);
6 this.handleSubmit = this.handleSubmit.bind(this);
7 }
8
9 handleChange(event) { this.setState({value: event.target.value}); }
10 handleSubmit(event) {
11 alert('A name was submitted: ' + this.state.value);
12 event.preventDefault();
13 }
14
15 render() {
16 return (
17 <form onSubmit={this.handleSubmit}>
18 <label>
19 Name:
20 <input type="text" value={this.state.value} onChange={this.handleChange} /> </label>
21 <input type="submit" value="Submit" />
22 </form>
23 );
24 }
25}
1const [count, setCount] = React.useState(0);
2 const [count2, setCount2] = React.useState(0);
3
4 // increments count by 1 when first button clicked
5 function handleClick(){
6 setCount(count + 1);
7 }
8
9 // increments count2 by 1 when second button clicked
10 function handleClick2(){
11 setCount2(count2 + 1);
12 }
13
14 return (
15 <div>
16 <h2>A React counter made with the useState Hook!</h2>
17 <p>You clicked {count} times</p>
18 <p>You clicked {count2} times</p>
19 <button onClick={handleClick}>
20 Click me
21 </button>
22 <button onClick={handleClick2}>
23 Click me2
24 </button>
25 );
1import React, { useEffect } from 'react';
2
3export const App: React.FC = () => {
4
5 useEffect(() => {
6
7 }, [/*Here can enter some value to call again the content inside useEffect*/])
8
9 return (
10 <div>Use Effect!</div>
11 );
12}
1class Example extends React.Component {
2 constructor(props) {
3 super(props);
4 this.state = {
5 count: 0
6 };
7 }
8
9 render() {
10 return (
11 <div>
12 <p>You clicked {this.state.count} times</p>
13 <button onClick={() => this.setState({ count: this.state.count + 1 })}>
14 Click me
15 </button>
16 </div>
17 );
18 }
19}
1import React, { useState } from 'react';
2
3function Example() {
4
5 const [count, setCount] = useState(0);
6
7 return (
8 <div>
9 <p>You clicked {count} times</p>
10 <button onClick={() => setCount(count + 1)}>
11 Click me
12 </button>
13 </div>
14 );
15}