5. v-for实现列表点击变色

思路：我们首先需要解决第一个列表项显示红色的问题，😀，我们的做法是通过定义一个currentIndex的变量来和当前的index值进行比较，如果相同就显示红色，这点想明白之后，就好办了😘，接下来我们只需要获取每次点击的列表项的索引，然后赋值给currentIndex就可以了，搞定😜

<div id="app">
        <ul>
            <li v-for="(item, index) in movies" @click="change(index)" :class="{demo:currentIndex === index}">
                {{item}}
            </li>
        </ul>
    </div>

    <script>
        var vm = new Vue({
            el: '#app',
            data: {
                movies: ['海王', '海贼王', '海尔兄弟'],
                currentIndex: 0
            },
            methods: {
                change(index) {
                    this.currentIndex = index;
                }
            }
        });
    </script>