ЯсноПонятно24

// hooks/useCounter.ts

import { useState } from 'react'; import CounterService from '../services/CounterService';

const useCounter = () => { const counterService = new CounterService(); const [counter, setCounter] = useState(counterService.getCounter());

const increment = () => { counterService.increment(); setCounter(counterService.getCounter()); };

const decrement = () => { counterService.decrement(); setCounter(counterService.getCounter()); };

const double = () => { counterService.double(); setCounter(counterService.getCounter()); };

const divide = () => { counterService.divide(); setCounter(counterService.getCounter()); };

return { counter, increment, decrement, double, divide }; };

export default useCounter;

// App.js

import React from 'react'; import useCounter from './hooks/useCounter';

const App = () => { const { counter, increment, decrement, double, divide } = useCounter();

return ( <div> <h1>Counter: {counter}</h1> <button onClick={increment}>Increment</button> <button onClick={decrement}>Decrement</button> <button onClick={double}>Double</button> <button onClick={divide}>Divide</button> </div> ); };

export default App;