vue3 v-if 多种情况渲染

在Vue 3中，你可以使用v-if指令来根据多种情况来进行渲染。v-if可以与v-else-if和v-else一起使用，来处理多个条件。下面是一个示例：

<template>
  <div>
    <p v-if="condition === 'A'">条件A</p>
    <p v-else-if="condition === 'B'">条件B</p>
    <p v-else-if="condition === 'C'">条件C</p>
    <p v-else>其他条件</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      condition: 'A'
    };
  }
};
</script>

在上面的示例中，根据`condition`的不同值，会渲染不同的段落。如果`condition`为'A'，则渲染条件A的段落；如果`condition`为'B'，则渲染条件B的段落；如果`condition`为'C'，则渲染条件C的段落；否则，渲染其他条件的段落。

你可以根据实际需求添加更多的v-else-if条件来处理更多的情况，或者只使用v-if和v-else来处理两种情况。