I denna parningsfilm kommer Sarah Drasner med mig och guidar mig genom några av mina allra första kunskaper om React. Vi tar itu med en del “verklig värld” -funktionalitet: ett kommentarformulär.
Detta visade sig vara en ganska användbar bit av användargränssnittet att arbeta med, eftersom det krävde många saker som var ganska grundläggande för React (eller åtminstone verkar det för mig). Till exempel en master "App" som handlar om state(vår stora "state" sak är kommentarerna själva) och komponenter som hanterar renderingen av vyn (till exempel är kommentarformuläret en komponent och varje kommentar är en komponent).
Sedan kom vi in i många små React-saker, men också enorma saker att förstå i React-land, som:
props- ett sätt att skicka data mellan komponenter. De ser ut som HTML-attribut när du skickar dem och anländer som ett objekt i form av this.props.refs- hur du hämtar data ur formelementet vi skapade.keys- ett sätt att identifiera en komponent unikt när den upprepas. Vi upprepar kommentarer här (det kan finnas flera kommentarer), så om vi skulle ha funktionalitet som kan ändra någon av dem, har det en nyckel som gör React effektiv (det kan bara ersätta den enskilda kommentaren istället för dem alla) .
Plus massor mer!
Här är den demo vi arbetat med:
Se pennan som startar ett reaktordrivet kommentarformulär av Chris Coyier (@chriscoyier) på CodePen.
Hur nivåerar du ditt React-lärande utöver detta? Börja här.