Сделали таймер

This commit is contained in:
2026-05-28 20:45:57 +03:00
parent b3662b759f
commit 12515f925d
2 changed files with 28 additions and 4 deletions
+28 -2
View File
@@ -72,11 +72,37 @@ class MyComponent3 extends React.Component {
}
}
}
class Timer extends React.Component {
constructor(props) {
super(props);
this.state = { seconds: 0 }
}
componentDidMount() {
console.log('Timer mounted');
this.interval = setInterval(()=>{
this.setState(prevState => ({seconds: prevState.seconds + 1}))
},1000);
}
componentWillUnmount() {
console.log('Timer unmount');
clearInterval(this.interval);
}
render() {
return <h2>Прошло секунд: {this.state.seconds}</h2>
}
}
function App() {
const [show,setShow] = React.useState(true);
return (
<>
<h1>Hello, React!</h1>
<MyComponent />
<h1>Таймер с классом</h1>
<button onClick={()=>setShow(prev => !prev)}>{show ? 'Скрыть' : 'Показать'} таймер</button>
{show && <Timer />}
</>
)
}
-2
View File
@@ -4,7 +4,5 @@ import { createRoot } from 'react-dom/client'
import App from './App.jsx'
createRoot(document.getElementById('root')).render(
<StrictMode>
<App />
</StrictMode>
)