在Vue中，单击时将多个按钮中的一个按钮更改为活动按钮

<template>
  <div>
    <button :class="{ active: isActive === 'button1' }" @click="setActive('button1')">按钮1</button>
    <button :class="{ active: isActive === 'button2' }" @click="setActive('button2')">按钮2</button>
    <button :class="{ active: isActive === 'button3' }" @click="setActive('button3')">按钮3</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      isActive: ''
    }
  },
  methods: {
    setActive(button) {
      this.isActive = button;
    }
  }
}
</script>

<style>
.active {
  background-color: blue;
  color: white;
}
</style>