How to do it...

First of all, let's write an empty Vue instance that we will fill:

new Vue ({   el: '#app' })

You will need some material to work with; by this, I mean a whole lot of animals to classify. You can copy maybe only a part of this code in your Vue instance data, but to give you some inspiration, here it comes, the longest listing in this whole book:

data: {   living: {     animals: {       invertebrates: {         crab: null,         bee: null,         ant: null       },       vertebrates: {         fish: {           shark: null         },         mammals: {           rabbit: null,           rat: null         }       }     },     plants: {       flowering: {         maize: null,         paddy: null       },       'non-flowering': {         algae: {           seaweed: null,           spirogyra: null         },         fungi: {           yeast: null,           mushroom: null         },         moss: null,         fern: null       }     }   } 

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.