Sveltejs Academy · Oppitunti

Propsien oletusarvot

Määrittäkää propseille varaarvot tilanteisiin, joissa ylätason komponentti ei välitä niitä.

Oppitunti 3/413 vaihetta

Propsien oletusarvot on ilmainen Sveltejs Academy-oppitunti CoddyKitissä. Tämä on oppitunti 3/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.

Miksi oletusarvoja käytetään

Oletusarvojen ansiosta komponenttia voi käyttää ilman, että jokainen käyttäjä välittää jokaisen propin. Ne määrittävät varakäyttäytymisen.

Sisäinen oletusarvo

Antakaa arvo propia ilmoitettaessa.

export let label = "Click me";

Funktio-oletusarvot

Oletusarvot voivat olla lausekkeita tai funktioliteraaleja.

export let onClick = () => {};

Objektin oletusarvot

Käyttäkää monimutkaisille oletusarvoille objektiliteraalia.

export let options = { color: "blue", size: "md" };

Varokaa jaettua viittausta

Objektiliteraalien oletusarvot arvioidaan instanssikohtaisesti, joten kukin komponentti saa oman objektinsa. Objektia voi muuttaa turvallisesti.

Ohittakaa oletusarvo vanhemmassa

Kun vanhempi komponentti välittää arvon, se korvaa kyseisen instanssin oletusarvon.

<Button label="Save" />

Pakollisuuden tunnistaminen

Ilman oletusarvoa prop on käsitteellisesti pakollinen. TypeScript voi valvoa tätä required-vihjeen avulla.

null ja undefined

Arvona välitetty undefined ottaa oletusarvon käyttöön, mutta null ei.

Oletusarvojen koostaminen

Koostakaa oletusarvoja muista proppeista reaktiivisilla määrittelyillä.

export let title = "";
export let subtitle;
$: effectiveSubtitle = subtitle ?? title;

Dokumentointi

Dokumentoikaa oletusarvot JSDoc-kommenteissa, jotta IDE:n työkaluvihjeet näyttävät ne.

/** @param {string} label */

Vakaat oletusarvot

Välttäkää oletusarvoja, jotka muuttuvat renderöintien välillä. Vakaat oletusarvot vähentävät uudelleenrenderöintejä ja yllättävää toimintaa.

Pikatarkistus

Miten propille asetetaan oletusarvo?

Kertaus

Määrittäkää oletusarvot tavallisella sijoituksella. Näin komponentit toimivat itsenäisesti ja käy selväksi, mitkä propit ovat valinnaisia.

Aloita maksutta

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 ”Propsien oletusarvot” ilmainen?

Kyllä – oppitunnin ”Propsien oletusarvot” 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 ”Propsien oletusarvot”?

Määrittäkää propseille varaarvot tilanteisiin, joissa ylätason komponentti ei välitä niitä. 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 3/4.

Kuinka kauan ”Propsien oletusarvot”-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

  1. Propsien määrittäminen export let -syntaksilla
  2. Propsien välittäminen ylätason komponentista
  3. Propsien oletusarvot
  4. Propsien välittäminen eteenpäin $$props- ja $$restProps-muuttujilla
← Takaisin: Sveltejs Academy