Grundlegende Anwendungsbeispiele für benannte Slots in Vue

<div>
 <myslot>Ich habe gerade</myslot>
</div>

<div>
 <Steckplatz><Steckplatz>
</div>

<div>
 <meinSlot>
  <template #one>Piggy ist eine große fette Katze</template>
  <template #two>Sie sind alle große Arschlöcher</template>
  <template #three>Mimi ist ein herzloser kleiner Bastard</template>
  Ich habe gerade
</div>

<div>
 <slot name="eins"></slot>
 <Steckplatz><Steckplatz>
 <slot name="zwei"></slot>
 <slot name="drei"></slot>
</div>

<div>
	<meinSlot>
		<Vorlage #oneData="oneData">
			<div>{{oneData.one.message}}</div>
		</Vorlage>
		<template #two>Sie sind alle große Arschlöcher</template>
		<template #three>Mimi ist ein herzloser kleiner Bastard</template>
		Ich habe nur </myslot>
</div>

<div>
 <slot name="eins" :data='eins'></slot>
 <Steckplatz><Steckplatz>
 <slot name="zwei"></slot>
 <slot name="drei"></slot>
</div>

<Skript>
 Standard exportieren {
  Daten() {
   zurückkehren {
    eins: {
     Nachricht: 'Dies ist die Datennachricht der Unterkomponente',
       },
   };
  },
 }
</Skript>

<div>
 <meinSlot>
  <Vorlage #oneData="{oneData}">
   <div>{{oneData.message}}</div>
  </Vorlage>
  <template #two>Sie sind alle große Arschlöcher</template>
  <template #three>Mimi ist ein herzloser kleiner Bastard</template>
  Ich habe gerade
</div>

<div>
 <slot name="eins" :oneData='eins'></slot>
 <Steckplatz><Steckplatz>
 <slot name="zwei"></slot>
 <slot name="drei"></slot>
</div>

<Skript>
 Standard exportieren {
  Daten() {
   zurückkehren {
    eins: {
     Nachricht: 'Dies ist die Datennachricht der Unterkomponente',
       },
   };
  },
 }
</Skript>