React Academy · Oppitunti

Tapahtumien, ref-viittausten ja Contextin tyypitys

Tyypittäkää Reactin yleiset osat: tapahtumankäsittelijät, elementtien ref-viittaukset ja context-arvot. Käyttäkää JSDocia TypeScriptin kaltaisesti, mutta pitäkää koodi suoritettavana.

Oppitunti 2/38 vaihetta

Tapahtumien, ref-viittausten ja Contextin tyypitys on ilmainen React Academy-oppitunti CoddyKitissä. Tämä on oppitunti 2/3. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu React Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. React Academy-kurssilla on yhteensä 3 oppituntia.

Miksi tapahtumien, refien ja kontekstin tyypitys?

Tavoite: Tyypitä Reactin jokapäiväiset osat.

  • Tapahtumat: click/change-käsittelijät
  • Refit: DOM-käyttö ilman uudelleenrenderöintiä
  • Context: tyypitetty arvo koko puussa

Keskeiset ideat

  • Tapahtumankäsittelijät saavat tyypitetyn event-olion.
  • Refit tallentavat DOM-solmun tai minkä tahansa muokattavan arvon.
  • Context käyttää tyypitettyä rakennetta prop drillingin välttämiseksi.

Esimerkki: tapahtumatyyppien perusteet

Dokumentoi tapahtumien rakenteet JSDocilla, jotta käsittelijät ovat selkeitä ja turvallisia.

<div id="root"></div>

Esimerkki: input-ref ja kohdistus

Luo ref input-kenttään ja kutsu focus()-metodia ilman uudelleenrenderöintiä.

<div id="root"></div>

Esimerkki: tyypitetyn kontekstin rakenne

Määritä kontekstin rakenne, tarjoa se yläosassa ja lue sitä lapsikomponenteissa.

<div id="root"></div>

Vinkit ja tarkistuslista

  • Kirjoita käsittelijöiden tyypit funktioiden lähelle käytön ohjaamiseksi
  • Käytä refeja DOM-käyttöön tai pysyviin muokattaviin arvoihin
  • Anna contextille pieni ja selkeä rakenne

Refien perusteiden tarkistus

Mikä on refien käytännöllinen käyttötarkoitus Reactissa?

Kertaus

Kertaus: Tyypitä tapahtumaparametrit, tallenna DOM-solmut refeihin imperatiivisia toimintoja, kuten kohdistusta, varten ja määritä pieni tyypitetty context arvojen jakamiseen koko puussa.

Aloita maksutta

Opi React tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit
88
Oppitunnit
324

Usein kysytyt kysymykset

Onko oppitunti ”Tapahtumien, ref-viittausten ja Contextin tyypitys” ilmainen?

Kyllä – oppitunnin ”Tapahtumien, ref-viittausten ja Contextin tyypitys” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko React Academy-kurssin, päivitä CoddyKit PROhon. React Academy-kurssilla on yhteensä 3 oppituntia.

Mitä opin oppitunnilla ”Tapahtumien, ref-viittausten ja Contextin tyypitys”?

Tyypittäkää Reactin yleiset osat: tapahtumankäsittelijät, elementtien ref-viittaukset ja context-arvot. Käyttäkää JSDocia TypeScriptin kaltaisesti, mutta pitäkää koodi suoritettavana. Harjoittelet React Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni React Academy-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin React Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 2/3.

Kuinka kauan ”Tapahtumien, ref-viittausten ja Contextin tyypitys”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä React Academy-oppitunnilla?

Kyllä. Jokainen React Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

  1. Propsien tyypitys ja geneerisyys uudelleenkäytettävissä komponenteissa
  2. Tapahtumien, ref-viittausten ja Contextin tyypitys
  3. Vaiheittainen siirtyminen
← Takaisin: React Academy