dexblog.ro
Acces rapid: Învață AI Învață Programare Specificații Dispozitive Comparații
VUE Toate comenzile Vue.js & Nuxt

Elementul <slot> în componentele Vue 3 în Vue.js & Nuxt

Componente Integrate și Distribuție de Conținut Toate versiunile Vue Q&A / Distribuie cod

Punct de distribuție a conținutului ce permite componentei părinte să injecteze markup în interiorul copilului.

Sintaxă 
<slot name='antet' :date='info'>Conținut Implicit</slot>

Ce este elementul

Elementul <slot> este fundamentul compoziției vizuale în Vue. El definește o zonă rezervată în șablonul copilului ce va fi umplută cu conținutul trimis de părinte. Dacă părintele nu transmite niciun conținut, va fi afișat conținutul de rezervă (fallback content) plasat între etichetele <slot>Implicit</slot>.

Exemplu Concret: Crearea unui card cu antet opțional
<!-- Card.vue -->
<template>
  <div class="card">
    <header v-if="$slots.antet" class="card-header">
      <slot name="antet" />
    </header>
    <main class="card-body">
      <slot>Conținut implicit dacă părintele nu trimite nimic.</slot>
    </main>
  </div>
</template>

Comunitate & Schimb de cunoștințe

Întrebări & Exemple de Cod: Elementul <slot> în componentele Vue 3

Ai o nelămurire despre utilizarea comenzii Elementul <slot> în componentele Vue 3 sau ai descoperit un truc / fragment de cod util? Distribuie-l cu ceilalți programatori!

💬

Fii primul care pune o întrebare sau distribuie un fragment de cod / prompt!

Nu au fost adăugate încă întrebări sau exemple de cod pentru această pagină. Dacă ai întâlnit o problemă sau ai un snippet util, adaugă-l mai jos pentru a-i ajuta pe ceilalți.

Comunitate Adaugă o întrebare sau distribuie un cod

Moderare & Siguranță:

Pentru a menține calitatea și securitatea informațiilor, fiecare întrebare sau fragment de cod/prompt este analizat (manual sau prin moderare asistată de AI) înainte de publicare.