{"@context":"https://schema.org","@type":"FAQPage","mainEntity":[{"@type":"Question","name":"What is a Vue component?","acceptedAnswer":{"@type":"Answer","text":"A Vue component is a reusable Vue instance with a name. It encapsulates HTML, CSS and JavaScript into an independent logical unit. Components allow dividing the user interface into reusable and maintainable pieces. Each component has its own template, logic and styles, facilitating code organization and reusability."}},{"@type":"Question","name":"How to declare props in a Vue 3 component with script setup?","acceptedAnswer":{"@type":"Answer","text":"In Vue 3 with script setup, defineProps() is a compiler macro that allows declaring props without explicit import. This macro automatically generates the necessary code and exposes props to the template. It supports TypeScript and JavaScript type validation, making the code more concise and type-safe than the Options API approach."}},{"@type":"Question","name":"What is the function of the onMounted() hook in a component lifecycle?","acceptedAnswer":{"@type":"Answer","text":"The onMounted() hook executes after the component has been mounted to the DOM. This is the ideal moment to perform operations that require DOM access, like initializing third-party libraries, fetching data via API, or directly manipulating DOM elements. At this stage, the template is rendered and refs are accessible."}},{"@type":"Question","name":"How does a child component emit an event to its parent component?","acceptedAnswer":{"@type":"Answer","text":"A child component uses defineEmits() to declare events it can emit, then calls the returned emit function to trigger the event. The parent listens to this event with v-on or @. This pattern enables unidirectional bottom-up communication, respecting Vue's data flow principle where props flow down and events flow up."}},{"@type":"Question","name":"What are slots used for in a Vue component?","acceptedAnswer":{"@type":"Answer","text":"Slots allow the parent component to pass custom HTML content into the child component's template. The element acts as a placeholder where the parent content will be inserted. This makes components more flexible and reusable, allowing creation of generic wrapper components like modals, cards or layouts that accept variable content."}},{"@type":"Question","name":"What does the scoped attribute on a