How it works...

When you bind a <select> element with v-model, the selected option will populate the bound variable.

Note that, if you set a value for your options, the variable will take it instead of what is written within the tags. For example, you can write as follows:

<select>   <option value="1">Japan</option>   <option value="2">India</option>   <option value="7">Canada</option> </select>

This ensures that you have every country bound to a numeric value.

Get Vue.js 2 Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.