vue 3.0 switch case

在Vue 3.0中，没有直接的switch case语法，但你可以使用v-if和v-else-if指令来实现类似的功能。下面是一个示例：

<template>
  <div>
    <button @click="changeColor('red')">Red</button>
    <button @click="changeColor('blue')">Blue</button>
    <button @click="changeColor('green')">Green</button>

    <div v-if="color === 'red'">This is red.</div>
    <div v-else-if="color === 'blue'">This is blue.</div>
    <div v-else-if="color === 'green'">This is green.</div>
    <div v-else>This is the default color.</div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      color: ''
    };
  },
  methods: {
    changeColor(newColor {
      this.color = newColor;
    }
  }
};
</script>

在上面的示例中，我们使用了v-if和v-else-if指令来根据不同的条件显示不同的内容。当点击按钮时，会调用changeColor方法来改变color的值，从而触发相应的条件判断。