What is v-model in Vue?
Why Interviewers Ask This
This is a classic screening question for Vue.js roles. Hiring managers ask it early in interviews to gauge your baseline understanding and determine if you can communicate technical concepts clearly.
Answer
v-model creates a two-way data binding between a form input and a data property — when the user types, the data updates; when the data changes programmatically, the input updates. It is syntactic sugar for :value + @input. Native inputs: <input v-model="username"> is equivalent to <input :value="username" @input="username = $event.target.value">. Works with: text inputs, textarea, select, checkboxes (boolean or array), radio buttons. On custom components (Vue 3): v-model on a component binds to a prop named modelValue and listens for update:modelValue event. Child component: const props = defineProps(["modelValue"]); const emit = defineEmits(["update:modelValue"]);. Template: <input :value="modelValue" @input="emit('update:modelValue', $event.target.value)">. Or use defineModel() (Vue 3.4+): const model = defineModel(); then <input v-model="model">. Multiple v-models: <UserForm v-model:firstName="firstName" v-model:lastName="lastName" /> — named v-models. Modifiers: v-model.lazy (sync on change instead of input — less frequent), v-model.number (auto-cast to number), v-model.trim (auto-trim whitespace). Custom modifiers possible via modifiers prop.
Pro Tip
Back up your answer with a specific project or situation. Saying 'In my last Vue.js project, I used this when...' immediately makes your answer more credible and memorable.