vue点击按钮切换样式

你可以使用 `v-bind:class` 指令给按钮绑定一个样式类，然后通过 JavaScript 代码来控制这个样式类是否应该被添加到按钮上。

例如，假设你有一个叫做 `selected` 的样式类，并且你想在按钮被点击的时候切换这个样式类的添加和删除。你可以在按钮的模板中这样写：

<template>
  <button v-bind:class="{ 'selected': isSelected }">Click me</button>
</template>

<script>
export default {
  data() {
    return {
      isSelected: false
    }
  }
}
</script>

然后你可以在按钮的事件处理函数中切换 `isSelected` 的值，从而控制按钮的样式。

<template>
  <button v-bind:class="{ 'selected': isSelected }" @click="toggleSelection">Click me</button>
</template>

<script>
export default {
  data() {
    return {
      isSelected: false
    }
  },
  methods: {
    toggleSelection() {
      this.isSelected = !this.isSelected
    }
  }
}
</script>

这样，当按钮被点击的时候，`selected` 样式类就会被添加到按钮上，再次点击的时候会被删除。