如下图代码：
通过动态的设置data的值，可以实现类似于tab切换的效果。
注：此处我们是在div标签中设置的data-year 这个值，当然，也可以在其他html标签中设置。
data-'自定义的名字'，data-后面的名字是可以自定义的。如：data-text、data-name、等等
效果如下：
获取标中data的值的方法：
e.currentTarget.dataset.year或e.target.dataset.year?
上面实现效果的代码如下：
<div class="change-year">
<div :class="fourCurYear == firstYear ? 'active' : ''" @click="changeFourCurYear" :data-year="firstYear">{{ firstYear }}年</div>
<div :class="fourCurYear == secondYear ? 'active' : ''" @click="changeFourCurYear" :data-year="secondYear">{{ secondYear }}年</div>
<div :class="fourCurYear == threeYear ? 'active' : ''" @click="changeFourCurYear" :data-year="threeYear">{{ threeYear }}年</div>
</div>?
changeFourCurYear(e) { // 注册的点击事件，当点击时设置fourCurYear为我们在html标签中datad定义的值，以此可以控制内容的展示和样式的切换
console.log(e);
console.log(e.currentTarget.dataset.year);
console.log(e.target.dataset);
this.fourCurYear = e.currentTarget.dataset.year
},
