#root
View Compiled
const { useState, useEffect } = React;
function GreatCounter() {
const [count, setCount] = useState(0);
const [lastAction, setLastAction] = useState("");
const decrement = () => {
setLastAction("-1");
setCount(count - 1);
};
const increment = () => {
setLastAction("+1");
setCount(count + 1);
};
return (
<div>
<p>Current counter value:</p>
<h2>{count}</h2>
<button onClick={increment}>Plus 1</button>
<button onClick={decrement}>Minus 1</button>
<p>Last button clicked:</p>
<h2>{lastAction}</h2>
</div>
);
}
ReactDOM.render(<GreatCounter/>, document.getElementById("root"));
View Compiled
This Pen doesn't use any external CSS resources.