function createOptimisticAction<TVariables>(options): (variables) => Transaction
function createOptimisticAction<TVariables>(options): (variables) => Transaction
Definiert in: packages/db/src/optimistic-action.ts:41
Erstellt eine optimistische Aktionsfunktion, die lokale optimistische Aktualisierungen sofort anwendet, bevor die eigentliche Mutation auf dem Server ausgeführt wird.
Dieses Muster ermöglicht reaktionsschnelle UI-Aktualisierungen, während die eigentliche Mutation läuft. Die optimistische Aktualisierung wird über den onMutate-Callback angewendet, und die Server-Mutation wird über die mutationFn ausgeführt.
• TVariables = unbekannt
Der Typ von Variablen, die an die Aktionsfunktion übergeben werden
CreateOptimisticActionsOptions<TVariables>
Konfigurationsoptionen für die optimistische Aktion
Funktion
Eine Funktion, die Variablen vom Typ TVariables akzeptiert und eine Transaktion zurückgibt
TVariables
const addTodo = createOptimisticAction<string>({
onMutate: (text) => {
// Instantly applies local optimistic state
todoCollection.insert({
id: uuid(),
text,
completed: false
})
},
mutationFn: async (text, params) => {
// Persist the todo to your backend
const response = await fetch('/api/todos', {
method: 'POST',
body: JSON.stringify({ text, completed: false }),
})
return response.json()
}
})
// Usage
const transaction = addTodo('New Todo Item')
const addTodo = createOptimisticAction<string>({
onMutate: (text) => {
// Instantly applies local optimistic state
todoCollection.insert({
id: uuid(),
text,
completed: false
})
},
mutationFn: async (text, params) => {
// Persist the todo to your backend
const response = await fetch('/api/todos', {
method: 'POST',
body: JSON.stringify({ text, completed: false }),
})
return response.json()
}
})
// Usage
const transaction = addTodo('New Todo Item')
Ihre wöchentliche Dosis JavaScript-Nachrichten. Jeden Montag kostenlos an über 100.000 Entwickler geliefert.