blob: efb32a2f9526a3881e3d91514dde426cbef07134 (
plain)
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
34
35
36
37
|
import { useState } from 'react'
const Button = (props) => {
return (
<button onClick={props.onclick}>
{props.text}
</button>
)
}
const Display = (props) => {
return (
<p>{props.text} {props.count}</p>
)
}
const App = () => {
// save clicks of each button to its own state
const [good, setGood] = useState(0)
const [neutral, setNeutral] = useState(0)
const [bad, setBad] = useState(0)
return (
<div>
<h1>give feedback</h1>
<Button onclick={() => setGood(good + 1)} text="good" />
<Button onclick={() => setNeutral(neutral + 1)} text="neutral" />
<Button onclick={() => setBad(bad + 1)} text="bad" />
<h2>statistics</h2>
<Display text="good" count={good} />
<Display text="neutral" count={neutral} />
<Display text="bad" count={bad} />
</div>
)
}
export default App
|
