追加した項目が一瞬だけ表示され、保存が終わると消えてしまいます。エラーは出ていません。原因はどれですか。
components/List.tsx
Browserで実行
'use client' Browserで実行
import { useOptimistic } from 'react'Browserで実行
import { add } from '@/app/actions' Browserで実行
export function List({ items }: { items: string[] }) {Browserで実行
const [shown, addOptimistic] = useOptimistic(Browserで実行
items,Browserで実行
(state: string[], next: string) => [...state, next],Browserで実行
) Browserで実行
async function handle(formData: FormData) {Browserで実行
addOptimistic(String(formData.get('name')))Browserで実行
await add(formData)Browserで実行
} Browserで実行
return (Browserで実行
<form action={handle}>Browserで実行
<input name="name" defaultValue="temp" />Browserで実行
<button type="submit">追加</button>Browserで実行
<p id="items">{shown.join(',')}</p>Browserで実行
</form>Browserで実行
)Browserで実行
}