Vue.js 2 Cookbook

Arrays

1. In the HTML, to achieve the same result, edit the list to reflect the following:

        <ul>             <li v-for="n in [10,9,8,7,6,5,4,3,2,1]">{{n}}</li>             <li>launch missile!</li>         </ul>

Although this list is identical to the previous one, we shouldn't put literal arrays in HTML markup.

2. We're better off with a variable that contains the array. Edit the preceding code to match the following:

        <ul>           <li v-for="n in countdown">{{n}}</li>           <li>launch missile!</li>         </ul>

3. Then put the array countdown in the JavaScript:

        new Vue({           el:'#app',           data: {             countdown: [10,9,8,7,6,5,4,3,2,1]           }         })