Custom hook example has missing dependency
Dieses Issue hat noch niemand übernommen.
Bewertung
- Schwierigkeit
- 1/5
- Geschätzter Aufwand
- Unter einer Stunde
- Anfängerfreundlichkeit
- 70/100
- Issue-Typ
- Dokumentation
- Klarheit
- Klar beschrieben
- Aktivitätsstatus
- Veraltet
- Tech-Stack
- javascript, react
- Bereich
- documentation
Rechercherichtung
Öffne content/docs/hooks-custom.md und überprüfe das useFriendStatus()-Beispiel in der Nähe von Zeile 91. Aktualisiere die Abhängigkeitsliste des Beispiels wie beschrieben. Überprüfe anschließend, dass die Dokumentation korrekt gerendert wird und das Beispiel die beabsichtigte Abhängigkeit zeigt.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Beschreibung
Regarding 'Building Your Own Hook' page (github link).
Small but critical mistake in custom hook example for function useFriendStatus(). It needs a dependency. I.E.
Change line 91 by inserting , [friendID].
Without the dependency this appears to be 'magic'. I found I had to add a dependency when writing my learning hook, otherwise my counter just spins indefinitely.
Example
Custom hook:
function useCounter(targetId: string) {
const [counter, setCounter] = useState(0);
useEffect(() => {
setCounter(counter+1);
}, [targetId]);
return counter;
}
Client code:
interface MainProps {
counterTargetId: string;
}
export default function MainPage(props: MainProps = {
counterTargetId: 'a',
}) {
const currentCount = useCounter(props.counterTargetId);
return (<div>
<p>
Count: {currentCount}
</p>
</div>);
}
function App() {
const [targetId, setTargetId] = useState('a');
return (
<div className="App">
<input
type="button"
value="Toggle"
onClick={() => setTargetId(targetId === 'a' ? 'b' : 'a')}/>
<MainPage counterTargetId={targetId}/>
</div>
)
}
- Vorherrschende Sprache
- JavaScript
- Sterne
- 11.8k
- Forks
- 7.9k
- Ø Merge
- 16 Std. 6 Min.
- Gemergte PRs (30 T.)
- 7
Beitragsleitfaden
Erste Schritte
- Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
- Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
- Forken Sie das Repository und arbeiten Sie in einem Branch.
- Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.
Mehr aus reactjs/react.dev
-
type: documentation
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 72/100
-
Schwierigkeit 1/5 Unter einer Stunde Anfängerfreundlichkeit 82/100
-
bug: unconfirmed
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 74/100
-
type: typos
Schwierigkeit 1/5 Unter einer Stunde Anfängerfreundlichkeit 90/100
-
bug: unconfirmed
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 68/100
Alle Issues in reactjs/react.dev
Ähnliche Issues
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 75/100
palladius/rails8-app-on-gcp#145 ·
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 65/100
dotenvx/dotenv-vscode#139 ·
-
test-change-proposal
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 65/100
web-platform-tests/interop#1455 ·
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 75/100
corsairdev/corsair#1764 ·
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 75/100