Vue JS Components and Props 2

Question 1

Which of the following is a valid way to register a child component locally in Vue 3 Options API?

Accepted Answer

components: { MyButton }

Answer

Local component registration in Options API is done via the `components` option object. The component is only available inside that parent component.

Question 2

What is a slot in Vue 3?

Accepted Answer

A mechanism to pass template content from parent to child

Answer

Slots allow parent components to inject HTML or template content into a child component's designated `<slot>` placeholders.

Question 3

When a prop's default value needs to be an object or array, how should you declare it in Vue 3?

Accepted Answer

As a factory function: default: () => ({})

Answer

Objects and arrays as prop defaults must be returned from a factory function to avoid sharing the same reference across all component instances.

Question 4

How do you emit a custom event from a child component in Vue 3 Composition API (`<script setup>`)?

Accepted Answer

const emit = defineEmits(['update']); emit('update', value)

Answer

`defineEmits` is the Composition API compiler macro for declaring emits in `<script setup>`, and the returned `emit` function is used to trigger events.

Question 5

What is the purpose of the `key` attribute when rendering lists of components?

Accepted Answer

It helps Vue identify which components have changed and need to be re-rendered

Answer

The `key` attribute gives Vue a hint to track each node's identity across re-renders, enabling efficient DOM diffing and correct component reuse.

Vue JS Practice Test

Vue JS Practice Test

Vue JS Components and Props 2