Tapahtumien välittäminen eteenpäin on:clickillä
Lähettäkää komponenttien tapahtumat uudelleen ylätason komponentille paljaalla on:-direktiivillä.
Tapahtumien välittäminen eteenpäin on:clickillä on ilmainen Sveltejs Academy-oppitunti CoddyKitissä. Tämä on oppitunti 4/4. 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 Sveltejs Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Sveltejs Academy-kurssilla on yhteensä 4 oppituntia.
Tapahtumien välitys
Välittääksenne lapsielementin tapahtuman komponenttinne kautta ylöspäin kirjoittakaa on:event ilman käsittelijää.
Välityksen perusteet
Tämä välittää sisäisen painikkeen click-tapahtuman MyButton-komponentin käyttäjälle.
<button on:click>Click</button>Kuunteleminen yläkomponenttina
Yläkomponentti kuuntelee komponenttia samalla tavalla kuin DOM-elementtiä.
<MyButton on:click={handle} />Useiden tapahtumien välitys
Voitte välittää niin monta natiiviten tapahtumaa kuin haluatte.
<input on:input on:focus on:blur />Wrapper-komponenttien etu
Tämä malli on olennainen wrapper-komponenttien, kuten painikkeiden, syötekenttien ja linkkien, rakentamisessa.
Yhdistäminen mukautettuihin tapahtumiin
Voitte yhdistää välitettyjä DOM-tapahtumia omiin createEventDispatcher-tapahtumiinne vapaasti.
Tapahtumaolion säilyttäminen
Välitetyt tapahtumat saapuvat yläkomponentille alkuperäinen DOM Event -olio muuttumattomana.
Muokkaimia ei tarvita
Jos haluatte yläkomponentin hallitsevan muokkaimia, jättäkää ne pois lapsikomponentista.
Ero mukautettuihin tapahtumiin
Välitys lähettää aidot DOM-tapahtumat uudelleen, kun taas mukautettu dispatch luo uusia tapahtumia.
TypeScript-yhteensopiva
Välitetyt tapahtumat säilyttävät tarkat tyyppinsä, kun yläkomponentti määrittelee ne TypeScriptissä.
Käytännössä
Useimmat design system -komponentit käyttävät välitystä säilyttääkseen joustavuutensa ilman kaikkien propsien luettelemista.
Pikatarkistus
Mitä on:click ilman käsittelijää tekee?
Kertaus
Paljaat on:event-direktiivit välittävät DOM-tapahtumat komponenttinne yläkomponentille ja mahdollistavat selkeät wrapper-rajapinnat.
Opi HTML 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
- 41
- Oppitunnit
- 163
Usein kysytyt kysymykset
Onko oppitunti ”Tapahtumien välittäminen eteenpäin on:clickillä” ilmainen?
Kyllä – oppitunnin ”Tapahtumien välittäminen eteenpäin on:clickillä” 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 Sveltejs Academy-kurssin, päivitä CoddyKit PROhon. Sveltejs Academy-kurssilla on yhteensä 4 oppituntia.
Mitä opin oppitunnilla ”Tapahtumien välittäminen eteenpäin on:clickillä”?
Lähettäkää komponenttien tapahtumat uudelleen ylätason komponentille paljaalla on:-direktiivillä. Harjoittelet Sveltejs Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.
Tarvitsenko kokemusta aloittaakseni Sveltejs Academy-opiskelun?
Aiempi kokemus ei ole tarpeen. CoddyKitin Sveltejs Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 4/4.
Kuinka kauan ”Tapahtumien välittäminen eteenpäin on:clickillä”-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ä Sveltejs Academy-oppitunnilla?
Kyllä. Jokainen Sveltejs 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
- on:click, on:input ja on:submit
- Tapahtumamuokkaimet: preventDefault, stopPropagation, once
- Mukautetut tapahtumat createEventDispatcherilla
- Tapahtumien välittäminen eteenpäin on:clickillä