[Mistake]: set-state-in-effect gives a wrong example of bad usage
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
Page
https://react.dev/reference/eslint-plugin-react-hooks/lints/set-state-in-render
Details
I want to sync state to a prop {/clamp-state-to-prop/}
A common problem is trying to "fix" state after it renders. Suppose you want to keep a counter from exceeding a
maxprop:
// ❌ Wrong: clamps during render
function Counter({max}) {
const [count, setCount] = useState(0);
if (count > max) {
setCount(max);
}
return (
<button onClick={() => setCount(count + 1)}>
{count}
</button>
);
}
As soon as
countexceedsmax, an infinite loop is triggered.
I think this Counter component can be rendered and clicked without issues.
The claim that an infinite loop will be triggered is incorrect.
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
Leia src/content/reference/eslint-plugin-react-hooks/lints/set-state-in-render.md, especialmente as linhas vinculadas 70–91 e a seção “I want to sync state to a prop”. Verifique o exemplo Counter e sua afirmação em relação ao comportamento descrito na issue; considera-se concluído quando o exemplo e a explicação descreverem com precisão o caso relatado.
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
- 2/5
- Tempo estimado
- 1-3 horas
- Status de atividade
- Pouca atividade
- Clareza
- Claramente especificada
- Facilidade para iniciantes
- 55/100