vue写法改变css的样式

用vue的数据驱动视图的写法来改变css的样式，而不是通过demo的方式来改变

html：

<a href="#/home/energy" @click="energy(1)">//这里跳转的方式可以忽略，我是在实验用a标签进行路由跳转
    <div :class="['hexagon2',{'hexagon2add':this.$store.state.threeD.energycla ==1}]">
    </div>//hexagon2：普通样式  hexagon2add：动态样式
</a>
<a href="#/home/property" @click="property(2)" style="margin-top:11px">
     <div :class="['hexagon2',{'hexagon2add':this.$store.state.threeD.energycla ==2}]">
     </div>
 </a>

js：

methods: {
    energy(num) {
      this.$store.state.threeD.energycla = num;//这里通过控制传过来的num来操作css所对应的布尔值
    },
    property(num) {
      this.$store.state.threeD.energycla = num;
    }
},