按钮样式切换

需求

描述：几个切换按钮，不同的选择，选择之后有不同的样式看，请求不同的数据。如下图所示：

技术框架

requireJs+vue

解决方案

1. 使用vue的样式绑定（传送门），涉及到一排不同的按钮，是用v-for渲染的，所以考虑点击每个数据获取相应的index或者唯一标识。在数据项上使用三元表达式来进行判断：当获取的唯一标识或者index与当前v-for循环渲染出来的标识或index相等时，就进行样式绑定，反之则不绑定样式。
2. 另一种方法：使用class绑定来完成需求，大致上与style绑定一种类型。但是样式是通过class来引用的，而不是内联样式。

1. 以上两种方法应对不同的场景：样式绑定具有更强的优先级；class绑定无法改变内联样式的样式。