-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathwriteASimpleCounter
More file actions
33 lines (32 loc) · 940 Bytes
/
writeASimpleCounter
File metadata and controls
33 lines (32 loc) · 940 Bytes
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
class Counter extends React.Component {
constructor(props) {
super(props);
this.state = {
count: 0
};
// BINDING THE DIFFERENT METHODS OF THE CLASS TO THIS
this.increment = this.increment.bind(this);
this.decrement = this.decrement.bind(this);
this.reset = this.reset.bind(this);
}
// BE CAREFUL WHEN SETTING STATE TO USE THE COLON ":" AND NOT THE ASSIGNMENT SIGN "="
increment (){
this.setState ({count : this.state.count +1});
}
decrement (){
this.setState ({count : this.state.count -1});
}
reset (){
this.setState ({count : 0});
}
render() {
return (
<div>
<button className='inc' onClick={this.increment}>Increment!</button>
<button className='dec' onClick={this.decrement}>Decrement!</button>
<button className='reset' onClick={this.reset}>Reset</button>
<h1>Current Count: {this.state.count}</h1>
</div>
);
}
};