Vue JS Forms and Validation

Question 1

How does `v-model` work on a `<textarea>` element in Vue 3?

Accepted Answer

It binds the textarea's value to a data property, keeping it in sync with reactive state

Answer

`v-model` works the same on `

Question 2

How do you bind a group of radio buttons to a single data value in Vue 3?

Accepted Answer

Use v-model on each radio input with the same data property; the value attribute determines what gets stored

Answer

All radio inputs in a group share the same `v-model` binding. When a radio is selected, its `value` attribute is assigned to the bound property.

Question 3

What does the `v-model.number` modifier do?

Accepted Answer

Automatically coerces the input's string value to a JavaScript number

Answer

HTML inputs always return strings. `.number` uses `parseFloat` to convert the input value to a number, so your data property receives a number instead of a string.

Question 4

How do you prevent form submission and handle it in Vue 3?

Accepted Answer

Answer

`@submit.prevent` combines event listening with `preventDefault()` in Vue's declarative style, blocking the browser's default form submission and calling your handler.

Question 5

How do you handle checkbox binding with an array in Vue 3?

Accepted Answer

Use v-model bound to an array; checked checkboxes push their value into the array

Answer

When `v-model` is bound to an array, Vue automatically adds the checkbox's `value` to the array when checked and removes it when unchecked.

Vue JS Practice Test

Vue JS Practice Test

Vue JS Forms and Validation