В този сдвоен екран, Сара Драснер се присъединява към мен и ме води през някои от първите ми научения за React. Справяме се с някои функционалности в „реалния свят“: формуляр за коментар.
Това се оказа доста полезен битов потребителски интерфейс за работа, тъй като изискваше много неща, които са основни за React (или поне ми се струва). Например главно „Приложение“, което се занимава с state(нашето голямо „състояние“ са самите коментари) и компоненти, които се занимават с изобразяване на изгледа (например формулярът за коментар е компонент и всеки коментар е компонент).
След това попаднахме в много по-малки неща от React, но също така и огромни неща за разбиране в React-land, като:
props- начин за предаване на данни между компонентите. Те приличат на HTML атрибути, когато ги изпращате и пристигат като обект под формата на this.props.refs- как извличате данни от елемента на формуляра, който създадохме.keys- начин за уникално идентифициране на компонент, когато се повтаря. Тук повтаряме коментари (може да има множество коментари), така че ако трябва да имаме функционалност, която може да промени всеки от тях, наличието на ключ е това, което прави React ефективен (той може просто да замени този единствен коментар вместо всички тях) .
Плюс още тон!
Ето демонстрацията, по която работихме:
Вижте писалката, стартираща формуляр за коментар, реагиран от Chris Coyier (@chriscoyier) в CodePen.
Как изравнявате вашето React обучение извън това? Започни тук.