O'Reilly logo

The Majesty of Vue.js by Kostas Maniatis, Alex Kyriakidis

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Homework

Now that you have a basic understanding of Vue's event handling, methods, computed properties, and so on, you should try something a bit more challenging. Start by creating an array of "Mayor" candidates. Each candidate has a "name" and a number of "votes". Use a button to increase the count of votes for each candidate. Use a computed property to determine who is the current Mayor, and display his name.

Finally when key C is pressed the elections start from the beginning, and all votes become 0:

Tip

JavaScript's sort() and map() methods could prove very useful and key modifiers will get you there.

To listen globally for events you should target the body element.

Example output

You can find a potential solution to this exercise here: https://goo.gl/2Sx4a5 ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required