useReducerExample.js
For the full content of this gist, refer to https://gist.github.com/CodingAbdullah/74a2949973d550e9a787bf725baab9c5
McMaster. Software Engineer with a keen interest in blockchain and web3.
import { useReducer } from 'react';
import './App.css';
let countReducer = (state, action) => {
const { type } = action;
if (type === 'increment') {
return {
clicks: state.clicks + 1
}
}
else if (type === 'decrement'){
return {
clicks: state.clicks - 1
}
}
}
const App = () => {
const [state, dispatch] = useReducer(countReducer, { clicks: 0 });
return (
<div className="App">
<h1>This is the Click Page!</h1>
<h6>{ state.clicks }</h6>
<button onClick={() => dispatch({ type: 'increment' })}>+</button>
<button onClick={() => dispatch({ type: 'decrement' })}>-</button>
</div>
);
}
export default App;