Heim > Artikel > Web-Frontend > Die Rolle des $-Symbols in Vue
Das
$-Symbol stellt die aktuelle Instanz in Vue dar und bietet Zugriff auf Instanzeigenschaften, Ereignisbus, Lebenszyklus-Hooks und spezielle Funktionen, einschließlich Zugriff auf Datenobjekte, Auslösen und Abhören von Ereignissen, Abrufen von Instanzreferenzen und Überprüfen von Stamminstanzen.
Die Rolle des $-Symbols in Vue
In Vue.js ist das $-Symbol eine spezielle Variable, die die aktuelle Instanz darstellt, an der gearbeitet wird. Es bietet Zugriff auf:
1. Instanzeigenschaften und -methoden
$data
: das Datenobjekt der Instanz $data
:实例的数据对象$props
:实例的属性对象$methods
:实例的方法对象$computed
:计算属性对象$watch
:监听属性对象2. 事件总线
$emit
:触发事件$on
:监听事件$once
:监听事件(仅触发一次)$off
:移除事件监听器3. 生命周期钩子
$beforeCreate
$created
$beforeMount
$mounted
$beforeUpdate
$updated
$beforeDestroy
$destroyed
4. 其他功能
$root
:获取根 Vue 实例$refs
:访问组件的引用$parent
:获取父组件实例$children
$props
: das Instanzattributobjekt $methods
: Methodenobjekt der Instanz $computed
: Berechnetes Attributobjekt
$watch
: Überwachungsattributobjekt
$emit
: Ereignisse auslösen 🎜🎜$on
: Ereignisse überwachen 🎜🎜$once
: Ereignis überwachen (nur einmal ausgelöst) 🎜🎜$off
: Ereignis-Listener entfernen 🎜🎜🎜🎜3. Lebenszyklus-Hook 🎜🎜🎜🎜$beforeCreate
🎜🎜 $created
🎜🎜$beforeMount
🎜🎜$montiert
🎜🎜$beforeUpdate
🎜🎜$updated
🎜🎜 $beforeDestroy
🎜🎜$destroyed
🎜🎜🎜🎜4. Andere Funktionen🎜🎜🎜🎜$root
: Holen Sie sich die Root-Vue-Instanz🎜🎜 $ refs
: Greifen Sie auf die Referenz der Komponente zu🎜🎜$parent
: Rufen Sie die Instanz der übergeordneten Komponente ab🎜🎜$children
: Rufen Sie die Instanz der untergeordneten Komponente ab🎜🎜🎜🎜 Anwendungsbeispiel: 🎜🎜<code class="js">methods: { increment() { this.$data.count++ // 访问数据对象 } }, mounted() { this.$on('my-event', this.handleEvent) // 监听事件 }, created() { console.log(this.$root) // 获取根实例 }</code>🎜Mithilfe des $-Symbols können Entwickler einfach auf Instanzstatus, Ereignisse und Verhalten in Vue-Komponenten zugreifen und diese bearbeiten. 🎜
Das obige ist der detaillierte Inhalt vonDie Rolle des $-Symbols in Vue. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!