在Vue中切换许多div onclick，而无需预先声明变量

<div>
  <button @click="showDiv1 = !showDiv1">Toggle div1</button>
  <button @click="showDiv2 = !showDiv2">Toggle div2</button>
  <button @click="showDiv3 = !showDiv3">Toggle div3</button>

  <div v-if="showDiv1">This is div1</div>
  <div v-if="showDiv2">This is div2</div>
  <div v-if="showDiv3">This is div3</div>
</div>

data() {
  return {
    showDiv1: false,
    showDiv2: false,
    showDiv3: false
  };
}

<div>
  <button @click="activeDiv = 'div1'">Show div1</button>
  <button @click="activeDiv = 'div2'">Show div2</button>
  <button @click="activeDiv = 'div3'">Show div3</button>

  <div v-show="isActive('div1')">This is div1</div>
  <div v-show="isActive('div2')">This is div2</div>
  <div v-show="isActive('div3')">This is div3</div>
</div>

computed: {
  isActive() {
    return (div) => {
      return this.activeDiv === div;
    };
  }
}