[Bug]: Example given in "Handling return values in forms" section for "use-server" docs fails to compile
Ninguém assumiu esta issue ainda.
- Linguagem predominante
- JavaScript
- Estrelas
- 11.8k
- Forks
- 7.9k
- Merge médio
- 1d 11h
- PRs com merge (30d)
- 11
Descrição
Summary
The following example is given in Handling return values in forms section for "use server" docs, fails to compile.
// requestUsername.js
'use server';
export default async function requestUsername(formData) {
const username = formData.get('username');
// ..
}
// UsernameForm.js
'use client';
import { useActionState } from 'react';
import requestUsername from './requestUsername';
function UsernameForm() {
const [state, action] = useActionState(requestUsername, null, 'n/a');
// ..
}
Page
https://react.dev/reference/rsc/use-server#handling-return-values
Details
It fails to compile because, as per the useActionState docs,
useActionState(action, initialState, permalink?)
the "action" (requestUsername in this case) should have previousState as the first argument,
and formData as the second argument.
However, for the above example, the requestUsername action has formData as the first argument,
rather than previousState. Therefore, it fails to compile.
The following is the correct way mentioned in the useActionState docs:
async function increment(previousState, formData) {
return previousState + 1;
}
function StatefulForm({}) {
const [state, formAction] = useActionState(increment, 0);
// ..
}
I can raise a PR for the fix, if it's okay.
Guia de contribuição
Primeiros passos
- Leia a issue inteira e depois o guia de contribuição do projeto.
- Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
- Faça um fork do repositório e trabalhe em uma branch.
- Abra um pull request que referencie o número da issue.
Direção de pesquisa
Comece pela seção vinculada “Handling return values in forms” na página use-server e compare o exemplo de useActionState com a documentação vinculada de useActionState. Atualize o exemplo de requestUsername para que seus argumentos correspondam à assinatura de ação documentada e, em seguida, verifique se o exemplo da documentação compila.
Escrita pelo modelo de indexação a partir do texto da issue.
Avaliação
- Stack de tecnologia
- javascript, react
- Domínio
- documentation
- Tipo de issue
- Documentação
- Dificuldade
- 1/5
- Tempo estimado
- Menos de uma hora
- Status de atividade
- Estagnada
- Clareza
- Claramente especificada
- Facilidade para iniciantes
- 45/100