Vue3 v-else ディレクティブ
Vue3 組み込みディレクティブv-elseディレクティブは、v-if または v-else-if の else ブロックを表すために使用されます。
基本説明
v-elseディレクティブは v-if または v-else-if 要素の直後に置く必要があり、先行するすべての条件が満たされないときにレンダリングされる内容を表します。
- 期待される型: なし（式は受け付けません）
- 機能: v-if の else ブロックを表します。前には v-if または v-else-if が必要です。
基本的な使い方
実例
<template>
<div>
<p v-if="isLoggedIn">おかえりなさい</p>
<p v-else>ログインしてください</p>
</div>
</template>
<script>
export default {
data() {
return { isLoggedIn: false }
}
}
</script>
<div>
<p v-if="isLoggedIn">おかえりなさい</p>
<p v-else>ログインしてください</p>
</div>
</template>
<script>
export default {
data() {
return { isLoggedIn: false }
}
}
</script>
その他の拡張