Mitä ovat slots ja scoped slots?

Question

Accepted Answer

**Slots** antavat vanhemmalle mahdollisuuden välittää **template-sisältöä** lapsi-komponentille — ne ovat tapa rakentaa joustavia, uudelleenkäytettäviä wrappereita (kortteja, modaaleja, layouteja), joissa kuluttaja hallitsee sisäistä merkkausta. ## Perusslot ```vue ``` ```vue

Title

Any content!

``` Lapsi määrittää "aukon" (``); vanhempi täyttää sen haluamallaan merkkauksella. Tämä on paljon joustavampaa kuin merkkijonojen välittäminen propsien kautta. ## Nimetyt slotit — useita insertio-pisteitä ```vue ``` ```vue

Main content (default slot)

``` ## Scoped slots — lapsi välittää dataa YLÖS slot-sisältöön Joskus lapsi-komponentilla on data, jota vanhemman slot-sisältö tarvitsee (esim. jokainen lista-elementti). **Scoped slots** exposoivat datan lapsi-komponentista vanhemman templateen: ```vue ``` ```vue ``` Scoped slots ovat avain **renderless/headless-komponentteihin**: lapsi käsittelee logiikan (silmukat, haku, state) ja antaa vanhemmalle täyden hallinnan esittelyyn. ## Miksi se on tärkeää Slots ovat Vuen sisällön jakelumekanismi — oleellinen uudelleenkäytettäville layout- ja wrapper-komponenteille. Nimetyt slotit tarjoavat useita insertio-pisteitä, ja scoped slots (lapsi-datan exposointi vanhemman määrittämiin templateihin) mahdollistavat tehokkaita malleja, kuten headless-komponentit ja muokattavat listat/taulukot. Ne tekevät Vue-komponenteista compositional-pohjaisia sen sijaan, että ne olisivat jäykkiä.