Compare commits

..

1 Commits

Author SHA1 Message Date
laktionov-as 43aeb40b20 i dont know 2026-06-18 18:53:17 +03:00
3 changed files with 45 additions and 1280 deletions
+9 -1256
View File
File diff suppressed because it is too large Load Diff
-3
View File
@@ -10,7 +10,6 @@
"preview": "vite preview"
},
"dependencies": {
"info": "^1.0.0",
"react": "^19.1.0",
"react-dom": "^19.1.0"
},
@@ -23,8 +22,6 @@
"eslint-plugin-react-hooks": "^5.2.0",
"eslint-plugin-react-refresh": "^0.4.19",
"globals": "^16.0.0",
"sass": "^1.99.0",
"sass-embedded": "^1.99.0",
"vite": "^6.3.5"
}
}
+35 -20
View File
@@ -1,29 +1,44 @@
import styles from './styles/App.module.scss'
import React, { useState, useCallback } from 'react'
import { useMutation, QueryClientProvider, QueryClient } from '@tanstack/react-query'
import PostAddForm from './components/PostAddForm'
function CounterButton({label, onClick}) {
return (
<button onClick={onClick} className={styles.counter_button}>{label}</button>
)
}
function CounterDisplay({value}) {
return (<div className={styles.counter_display}>
Значение счетчика: <b>{value}</b>
</div>)
/*
const mutation = useMutation({
mutationFn: newUser => {
fetch('https://jsonplaceholder.typicode.com/users', {
method: 'GET',
headers: {'Content-type':'application/json'},
body: JSON.stringify(newUser),
}).then(res => res.json())
}
})
*/
const createQueryClient = () => {
new QueryClient({
defaultOptions: {
queries: {
staleTime: 5 * 60*1000,
retry: 1,
gcTime: 10*60*1000,
refetchOnWindowFocus: false,
},
mutations: {
retry:0,
onError: error => {console.error('Mutation error:',error.message)}
}
}
})
}
function App() {
const [counter,setCounter] = useState(0);
const increment = () => setCounter(prev => prev + 1);
const decrement = () => setCounter(prev => prev - 1);
return (
<>
<h2>Практика по созданию счетчика с колбэками</h2>
<CounterButton label="Увеличить" onClick={increment} />
<CounterButton label="уменьшить" onClick={decrement} />
<CounterDisplay value={counter} />
{/* Добавьте тестовый контент для проверки */}
<h1>Hello, React!</h1>
<QueryClientProvider client={createQueryClient}>
<PostAddForm />
</QueryClientProvider>
</>
)
}