FR @swebdev
Showing posts older than #3713 · Back to latest
ɵmarkDirty() в компоненте?
useOptimistic() в React позволяет обновлять состояние интерфейса до завершения серверного запроса, создавая ощущение мгновенного отклика. Первым аргументом передаётся массив или объект исходного состояния, вторым — функция, формирующая новое состояние из предыдущего и действия.'use client';
import { useOptimistic } from 'react';
function TodoList({ todos }) {
const [optimisticTodos, addOptimisticTodo] = useOptimistic(
todos,
(state, newTodo) => [...state, newTodo]
);
const handleAdd = async (text) => {
addOptimisticTodo({ text });
await fetch('/api/todo', { method: 'POST', body: JSON.stringify({ text }) });
};
return (
<ul>
{optimisticTodos.map((todo, i) => <li key={i}>{todo.text}</li>)}
</ul>
);
}
addOptimisticTodo мгновенно обновляет список до ответа сервера. После получения реального ответа можно синхронизировать состояние или повторно перерендерить данные.
findDOMNode()?
