There's more...

Often, countries and cities are arranged in hierarchical ways. This means that we need two or more select elements to pin down a user birth place, for example. In this paragraph, we will explore a little bit of hierarchical selection with multiple drop-down menus. Since there are too many cities in the world, I will use a biological equivalent and we will select from animals:

clans: {   mammalia: {     'have fingers': {       human: 'human',       chimpanzee: 'chimpanzee'     },     'fingerless': {       cat: 'cat',       bear: 'bear'     }   },   birds: {     flying: {       eagle: 'eagle',       pidgeon: 'pidgeon'     },     'non flying': {       chicken: 'chicken'     }   } }

We will call the top level a clan, the second level a type and the last will be an animal. I know it's an ...

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.