# Vue-Komponenten (Vue.js / Nuxt.js)

> Komponenten-Lifecycle, Props, Events, Slots, Scoped Styles, Komponentenkommunikation, dynamische Komponenten

- 20 Interview-Fragen
- Junior
- [Interview-Fragen: Vue.js / Nuxt.js](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen.md)

## 1. Was ist eine Vue-Komponente?

**Antwort**

Eine Vue-Komponente ist eine wiederverwendbare Vue-Instanz mit einem Namen. Sie kapselt HTML, CSS und JavaScript in einer unabhängigen logischen Einheit. Komponenten ermöglichen es, die Benutzeroberfläche in wiederverwendbare und wartbare Teile zu zerlegen. Jede Komponente hat ihr eigenes Template, ihre eigene Logik und ihre eigenen Styles, was die Code-Organisation und die Wiederverwendbarkeit erleichtert.

## 2. Wie deklariert man Props in einer Vue-3-Komponente mit script setup?

**Antwort**

In Vue 3 mit script setup ist defineProps() ein Compiler-Makro, mit dem sich Props ohne expliziten Import deklarieren lassen. Dieses Makro generiert automatisch den nötigen Code und stellt die Props dem Template zur Verfügung. Es unterstützt die Typvalidierung von TypeScript und JavaScript und macht den Code prägnanter und typsicherer als der Ansatz der Options API.

## 3. Welche Funktion hat der onMounted()-Hook im Lifecycle einer Komponente?

**Antwort**

Der onMounted()-Hook wird ausgeführt, nachdem die Komponente in das DOM eingehängt wurde. Dies ist der ideale Zeitpunkt für Operationen, die DOM-Zugriff erfordern, wie das Initialisieren von Drittanbieter-Bibliotheken, das Abrufen von Daten über eine API oder das direkte Manipulieren von DOM-Elementen. In diesem Stadium ist das Template gerendert und die Refs sind zugänglich.

## 17 weitere Fragen verfügbar

- Wie sendet eine Kindkomponente ein Event an ihre Elternkomponente?
- Wofür werden Slots in einer Vue-Komponente verwendet?

Kostenlos registrieren: https://sharpskill.dev/de/login

## Weitere Vue.js / Nuxt.js-Interviewthemen

- [JavaScript-Grundlagen](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/javascript-fundamentals.md): 20 Fragen, Junior
- [Modernes JavaScript (ES6+)](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/es6-modern-javascript.md): 20 Fragen, Junior
- [Vue-Grundlagen](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vue-basics.md): 22 Fragen, Junior
- [Vue Router](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vue-router.md): 18 Fragen, Junior
- [Pinia State Management](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/pinia-state-management.md): 20 Fragen, Junior
- [Vuex (Legacy)](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vuex-legacy.md): 15 Fragen, Mid-Level
- [Composition API](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/composition-api.md): 24 Fragen, Mid-Level
- [Vue-Reaktivität](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vue-reactivity.md): 20 Fragen, Mid-Level
- [Nuxt-Grundlagen](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/nuxt-fundamentals.md): 22 Fragen, Mid-Level
- [Nuxt Data Fetching](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/nuxt-data-fetching.md): 20 Fragen, Mid-Level
- [Nuxt SSR & SSG](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/nuxt-ssr-ssg.md): 22 Fragen, Mid-Level
- [Nuxt Server-Routes](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/nuxt-server-routes.md): 20 Fragen, Mid-Level
- [Nuxt-Module](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/nuxt-modules.md): 18 Fragen, Mid-Level
- [Vue Composables](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vue-composables.md): 20 Fragen, Mid-Level
- [Vue Formulare & Validierung](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vue-forms-validation.md): 20 Fragen, Mid-Level
- [Nuxt State Management](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/nuxt-state-management.md): 18 Fragen, Mid-Level
- [Vue-Testing](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vue-testing.md): 20 Fragen, Mid-Level
- [Nuxt-Deployment & CI/CD](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/nuxt-deployment-cicd.md): 22 Fragen, Mid-Level
- [Vue-Performance](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vue-performance.md): 22 Fragen, Senior
- [Fortgeschrittene Vue-Patterns](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vue-advanced-patterns.md): 24 Fragen, Senior
- [TypeScript mit Vue](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/typescript-vue.md): 22 Fragen, Senior
- [Nuxt-Authentifizierung](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/nuxt-auth.md): 20 Fragen, Senior
- [SEO mit Nuxt](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/nuxt-seo.md): 20 Fragen, Senior
- [Nuxt-Internationalisierung](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/nuxt-i18n.md): 18 Fragen, Senior
- [Vue-Architektur](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vue-architecture.md): 22 Fragen, Senior
- [Nuxt-Sicherheit](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/nuxt-security.md): 20 Fragen, Senior
- [Vue-Ökosystem](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vue-ecosystem.md): 18 Fragen, Senior
- [Migration Vue 2→3 & Nuxt 2→3](https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/migration-vue2-vue3-nuxt2-nuxt3.md): 22 Fragen, Senior

---

Source: SharpSkill (https://sharpskill.dev), tech interview preparation for your real stack.
HTML version of this page: https://sharpskill.dev/de/technologies/vue-nuxt/interviewfragen/vue-components