I denne sammenkoblingen viser Sarah Drasner meg og guider meg gjennom noen av mine aller første erfaringer med React. Vi takler noen “virkelige verdens” stilfunksjonalitet: et kommentarskjema.
Dette viste seg å være en ganske nyttig brukergrensesnitt å jobbe med, da det krevde mange ting som var ganske grunnleggende for å reagere (eller i det minste ser det ut for meg). For eksempel en mester "App" som tar for seg den state
(vår store "tilstand" er kommentarene i seg selv) og komponenter som omhandler gjengivelse av visningen (for eksempel er kommentarskjemaet en komponent og hver kommentar er en komponent).
Så fikk vi mange små React-ting, men også store ting å forstå i React-land, som:
props
- en måte å overføre data mellom komponentene på. De ser ut som HTML-attributter når du sender dem, og ankommer som et objekt i form av this.props.refs
- hvordan du fanger data ut av skjemaelementet vi opprettet.keys
- en måte å identifisere en komponent på en unik måte når den gjentas. Vi gjentar kommentarer her (det kan være flere kommentarer), så hvis vi skulle ha funksjonalitet som kan endre noen av dem, har det en nøkkel som gjør React effektiv (det kan bare erstatte den enkelte kommentaren i stedet for dem alle) .
Pluss massevis mer!
Her er demoen vi jobbet med:
Se pennen som starter et reaksjonsdrevet kommentarskjema av Chris Coyier (@chriscoyier) på CodePen.
Hvordan nivåerer du React-læringen utover dette? Start her.