很多时候Web在运行时要更改元素的CSS类名。但是在改变类名时，有时最好是有条件地应用样式。例如你有一个翻页的效果。翻页效果通常有一个高亮的效果，用于向用户显示当前页，这对于用户而言是很有帮助的。该项目的样式是有条件设置的，基于当前正在查看的页面。
在这个示例中，共有五页，每次只选择其中一个页面。如果你用Bootstrap构建一个分页器，那么所选的页面将有一个名为 active 的CSS类名应用在列表项中。如果页面是当前浏览的页面，那么你希望该类被应用。换句话说，你希望有条件地应用 active 类名。在Vue中，提供了一种方法，可以有条件地将CSS类应用于元素。在接下来的内容中将向大家展示这种技术。
要在运行时有条件地应用CSS类，需要绑定到一个JavaScript对象。要成功完成这个任务，必须完成两个步骤。首先，必须确保定义了CSS类名，然后在模板中创建类绑定。在本文的其他部分，我将详细解释这些步骤。
Step1: 定义你的CSS类名
想象一下，在一段时间内，上面图像中显示的五个页面荐是使用像下面的HTML代码构建的：
1
2
3
4
5
