diff --git a/src/App.jsx b/src/App.jsx
index 6bf3ac6..7e35cc8 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -1,10 +1,82 @@
-// удаляем все, оставляя лишь пустую функцию App ниже
+import React from 'react'
+class MyComponent extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = { data: null };
+ this.handleClick = this.handleClick.bind(this);
+ }
+
+ render() {
+ return (
+
+ {this.state.data ? (
+
Данные: {this.state.data}
+ ) : (
+
Загрузка...
+ )}
+
+
+ )
+ }
+
+ componentDidMount() {
+ fetch('https://api.example.com/data')
+ .then(responce => responce.json())
+ .then(json => this.setState({data: json}));
+
+ this.timerId = setInterval(()=> console.log('Tick'), 1000);
+ }
+
+ componentWillUnmout() {
+ clearInterval(this.timerId);
+ }
+
+ handleClick() {
+ this.setState({data: 'Данные'})
+ }
+}
+
+class MyComponent2 extends React.Component {
+ controller = new AbortController()
+
+ componentDidMount() {
+ fetch('https://api.example.com/data',{ singnal: this.controller.signal })
+ .then(responce => responce.json())
+ .then(json => this.setState({data: json}))
+ .catch(error => {
+ if(error.name == 'AbortError') {
+ console.log('Aborted');
+ } else {
+ console.log('Other error',error);
+ }
+ });
+ }
+
+ componentWillUnmount() {
+ this.controller.abort()
+ }
+}
+class MyComponent3 extends React.Component {
+ componentDidMount() {
+ this.loadData();
+ }
+
+ async loadData() {
+ try {
+ const response = await fetch('https://api.example.com/data');
+ const data = await response.json();
+ this.setSate({ data });
+ } catch {
+ console.log('error');
+ }
+ }
+}
function App() {
return (
<>
- {/* Добавьте тестовый контент для проверки */}
Hello, React!
+
>
)
}