<div v-if="type === 'A'">
  A
</div>
<div v-else-if="type === 'B'">
  B
</div>
<div v-else-if="type === 'C'">
  C
</div>
<div v-else>
  Не A/B/C
</div>

{#if type === 'A'}
  <div>
    A
  </div>
{:else if type === 'B'}
  <div>
    B
  </div>
{:else if type === 'C'}
  <div>
    C
  </div>
{:else}
  <div>
    Не A/B/C
  </div>
{/if}

<ul id="example-1">
  <li v-for="item in items" :key="item.id">
    {{ item.message }}
  </li>
</ul>

<ul id="example1">
  {#each items as item (item.id)}
    <li>{item.message}</li>
  {/each}
</ul>

const vm = new Vue({
  el: '#example',
  data: {
    message: 'Привет'
  },
  computed: {
    // геттер вычисляемого значения
    reversedMessage: function () {
      // `this` указывает на экземпляр vm
      return this.message.split('').reverse().join('')
    }
  }
})

let message = 'Привет';
$: reversedMessage = message.split('').reverse().join('');