Heim  >  Artikel  >  Web-Frontend  >  Eine kurze Analyse der Verwendung von Slots und Konfigurationsagenten in Vue

Eine kurze Analyse der Verwendung von Slots und Konfigurationsagenten in Vue

青灯夜游
青灯夜游nach vorne
2023-02-02 20:06:142016Durchsuche

Wie verwende ich Slots und konfiguriere Proxys in Vue richtig und schnell? Der folgende Artikel wird Ihnen die Verwendung von Slots und die Konfiguration von Agenten in Vue vorstellen. Ich hoffe, er wird Ihnen hilfreich sein! 1. Slot zwischen Komponenten, anwendbar auf übergeordnete Komponente ->untergeordnete Komponente. Es gibt drei Arten von Slots, nämlich

Standard-Slot

, Eine kurze Analyse der Verwendung von Slots und Konfigurationsagenten in Vuebenannter Slot

und

Scope-Slot Im Folgenden wird aufgeführt, wie diese drei Slots verwendet werden

1.1Standard-Slot Was ist der Standard-Slot? Tatsächlich entspricht der Standardsteckplatz dem Kauf eines neuen Hauses, und dann wurden alle Räume dekoriert, aber Sie haben immer noch einen Raum, der noch nicht dekoriert wurde, weil Sie nicht wissen, ob Sie eine Reihe von e installieren sollen - Sportausrüstung oder ein Bücherregal darin lassen. Dann kommen Sie ins Einkaufszentrum und sehen sich das Bücherregal an, das Ihnen gefällt, und dann stellen Sie das Bücherregal in den freien Raum Raum und schließen Sie ihn an. Das Gleiche gilt für Steckplätze. Eine untergeordnete Komponente ist wie ein leerer Raum und eine übergeordnete Komponente wie ein Lieblingsbücherregal (denken Sie daran, cc3f4a8ff7ae5a45d3e8383b957342dc und das war's) [Verwandte Empfehlung: vuejs Video-Tutorial, Web-Front-End-Entwicklung]

Definieren Sie einen Slot in der untergeordneten Komponente
<template>
  <div class="category">
    <h3>{{title}}</h3>
    <!-- 定义一个插槽(等待组件的使用者进行填充) -->
    <slot>我是默认插槽,在没有传结构式我才会显示该片段文字</slot>
  </div>
</template>

übergeordnete Komponente

Fülldaten

 <Category title="美食">
      <img slot src="./assets/logo.png" alt>
 </Category>
1.2 benannter SlotEinfach ausgedrückt: Der Slot hat ein weiteres Namensattribut als der Standard-Slot. In der übergeordneten Komponente gibt es eine zusätzliche Codezeile Der benannte Slot kann den Speicherort der Daten besser steuern. Übergeordnete Komponente in der Komponente selbst, aber die auf Basis der Daten generierte Struktur wird benötigt. Die Entscheidung liegt beim Benutzer der Komponente. (Die Spieldaten befinden sich in der Kategoriekomponente, aber die Struktur, die mithilfe der Daten durchlaufen wird, wird von der App-Komponente bestimmt.) 1: Fügen Sie in vue die folgende Konfiguration zu .config.js hinzu nicht flexibel (wenn Sie über Ressourcen verfügen, diese aber anfordern müssen. Für Nicht-Front-End-Ressourcen können Sie nur Ihre eigenen vorhandenen Ressourcen verwenden)

Proxy-Prozess: Eine Anfrage senden? Ressourcen, dann nutzen Sie sie Wenn Sie bestimmte Anforderungen festlegen, die keine anderen Ports anfordern können, kann sich ChangeOrigin auch auf denselben Port des Servers für die angeforderte Ressource ändern (einfach ausgedrückt: Wenn ChangeOrigin auf „Falsch“ gesetzt ist, wird der angeforderte Server verwendet wird angezeigt)

(Teilen von Lernvideos: vuejs Einführungs-Tutorial

,

Grundlegendes Programmiervideo)

Das obige ist der detaillierte Inhalt vonEine kurze Analyse der Verwendung von Slots und Konfigurationsagenten in Vue. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:csdn.net. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen