Compare commits

..

1 Commits

Author SHA1 Message Date
laktionov-as 43aeb40b20 i dont know 2026-06-18 18:53:17 +03:00
2 changed files with 33 additions and 85 deletions
+30 -84
View File
@@ -1,98 +1,44 @@
import { useState, useRef, useEffect } from 'react' import { useMutation, QueryClientProvider, QueryClient } from '@tanstack/react-query'
import PostAddForm from './components/PostAddForm'
function Example() { /*
const myRef = useRef(null); const mutation = useMutation({
const counterRef = useRef(0); mutationFn: newUser => {
const [text, setText] = useState(''); fetch('https://jsonplaceholder.typicode.com/users', {
method: 'GET',
useEffect(() => { headers: {'Content-type':'application/json'},
myRef.current?.focus(); body: JSON.stringify(newUser),
},[]); }).then(res => res.json())
const handlerFocus = () => {
if(myRef.current) {
myRef.current.focus();
} }
}; })
*/
const handlerChange = (event) => { const createQueryClient = () => {
setText(event.target.value); new QueryClient({
} defaultOptions: {
counterRef.current += 1; queries: {
return <div> staleTime: 5 * 60*1000,
<input ref={myRef} text="text" /><br /> retry: 1,
Количество рендров: {counterRef.current}<br /> gcTime: 10*60*1000,
<input text="text" onChange={handlerChange} value={text} /> refetchOnWindowFocus: false,
<button onClick={handlerFocus}>Поставить фокус на поле</button> },
</div> mutations: {
} retry:0,
onError: error => {console.error('Mutation error:',error.message)}
function ClickCounter() {
const countRef = useRef(0);
function handlerClick() {
countRef.current += 1;
//alert(`Нажали ${countRef.current} раз.`);
}
return <button onClick={handlerClick}>Нажать</button>;
}
function TimerComponent() {
const timerIdRef = useRef(null);
useEffect(() => {
timerIdRef.current = setTimeout(() => {
alert("Прошло 3 секунды");
}, 3000);
return () => {
clearTimeout(timerIdRef.current);
}
},[]);
}
function PrevValue({ value }) {
const prevValueRef = useRef();
useEffect(() => {
prevValueRef.current = value;
});
return (
<div>
Текущее значение: {value} <br />
Предыдущее значение: {prevValueRef.current}
</div>
)
}
function ScrollList() {
const listRef = useRef(null);
const scrollToBottom = () => {
if(listRef.current) {
listRef.current.scrollTop = listRef.current.scrollHeight;
} }
} }
})
return (
<>
<div ref={listRef}
style={{height: 200, overflowY: 'auto', border: '1px solid black'}}>
{[...Array(20)].map((_,i)=>(
<div key={i}>Элемент {i + 1}</div>
))}
</div>
<button onClick={scrollToBottom}>Прокрутить вниз</button>
</>
)
} }
function App() { function App() {
return ( return (
<> <>
{/* Добавьте тестовый контент для проверки */}
<h1>Hello, React!</h1> <h1>Hello, React!</h1>
<ScrollList /> <QueryClientProvider client={createQueryClient}>
<PostAddForm />
</QueryClientProvider>
</> </>
) )
} }
+2
View File
@@ -4,5 +4,7 @@ import { createRoot } from 'react-dom/client'
import App from './App.jsx' import App from './App.jsx'
createRoot(document.getElementById('root')).render( createRoot(document.getElementById('root')).render(
<StrictMode>
<App /> <App />
</StrictMode>
) )