テンプレートの中で条件分岐したい場合v-ifやv-else-if、v-elseが使えます。これらは必ず同じ階層にある必要があります。またv-else-ifとv-elseは単体では使えず同階層にv-ifが必要です。
例です。
<template>
<span v-if="num === 1">one {{num}}</span>
<span v-else-if="num === 2">two {{num}}</span>
<span v-else>three {{num}}</span>
</template>
<script>
export default {
data() {
return {
num: 1
};
}
};
</script>
