Heim > Artikel > Web-Frontend > Erfahren Sie mehr über „Bereitstellen/Injizieren“ in Vue
Dieser Artikel vermittelt Ihnen das Wissen über „Bereitstellen/Injizieren in Vue“ und hofft, Freunden in Not helfen zu können ein Attribut: inject. Dann habe ich die offizielle Website Provider/Inject überprüft: Einfach ausgedrückt wird die Variable über Provider in der übergeordneten Komponente bereitgestellt und dann über Inject in die untergeordnete Komponente eingefügt.
Lassen Sie uns unsere Vermutung überprüfen:
Zuerst: Definieren Sie eine übergeordnete Komponente
<template> <p> <childOne></childOne> </p> </template> <script> import childOne from '../components/test/ChildOne' export default { name: "Parent", provide: { for: "demo" }, components:{ childOne } }
<template> <p> {{demo}} <childtwo></childtwo> </p> </template> <script> import childtwo from './ChildTwo' export default { name: "childOne", inject: ['for'], data() { return { demo: this.for } }, components: { childtwo } } </script>
<template> <p> {{demo}} </p> </template> <script> export default { name: "", inject: ['for'], data() { return { demo: this.for } } } </script>Wie aus dem obigen Beispiel ersichtlich ist, solange es im aufgerufen wird übergeordnete Komponente, dann in Während des Lebenszyklus dieser übergeordneten Komponente können alle untergeordneten Komponenten inject aufrufen, um den Wert in die übergeordnete Komponente einzufügen.
Verwandte Empfehlungen:
vue 2 Verwenden von Bus.js zur Implementierung der Nicht-Eltern-Kind-Komponentenkommunikation Chat-Beispiel basierend auf Vue .js und Webpack Best Practices für Vue.js (fünf Tipps, um Sie zum Vue.js-Meister zu machen)Das obige ist der detaillierte Inhalt vonErfahren Sie mehr über „Bereitstellen/Injizieren“ in Vue. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!