vue switch case

在Vue中，你可以使用`<template>`的`<switch>`和`<case>`组件来实现类似于`switch...case`的逻辑判断。这是一种条件渲染的方法，根据不同的条件渲染不同的内容。

下面是一个使用`<switch>`和`<case>`的示例：

<template>
  <div>
    <switch :value="fruit">
      <case value="apple">
        <p>This is an apple.</p>
      </case>
      <case value="banana">
        <p>This is a banana.</p>
      </case>
      <case value="orange">
        <p>This is an orange.</p>
      </case>
      <case value="grape">
        <p>This is a grape.</p>
      </case>
      <default>
        <p>Unknown fruit.</p>
      </default>
    </switch>
  </div>
</template>

<script>
export default {
  data() {
    return {
      fruit: 'banana'
    };
  }
};
</script>

在上面的示例中，根据`fruit`的值，渲染不同的内容。如果`fruit`的值是`apple`，则会渲染出"This is an