createOptimisticAction
函数：createOptimisticAction()
ts
function createOptimisticAction<TVariables>(options): (variables) => Transaction
function createOptimisticAction<TVariables>(options): (variables) => Transaction
定义于：packages/db/src/optimistic-action.ts:41
创建一个乐观操作函数，该函数在服务器上执行实际的 mutation 之前立即应用本地乐观更新。
此模式允许在实际 mutation 进行时进行响应式 UI 更新。乐观更新通过 onMutate 回调应用，服务器 mutation 通过 mutationFn 执行。
类型参数
• TVariables = unknown
将传递给操作函数的变量的类型
参数
options
CreateOptimisticActionsOptions<TVariables>
乐观操作的配置选项
Returns (返回)
Function
一个函数，它接受 TVariables 类型的变量并返回一个 Transaction
参数
变量
TVariables
Returns (返回)
示例
ts
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')
我们的合作伙伴
订阅 Bytes
您的每周 JavaScript 资讯。每周一免费发送给超过 10 万开发者。
订阅 Bytes
您的每周 JavaScript 资讯。每周一免费发送给超过 10 万开发者。