Vue（Javascript）「2以上5未満」みたいな条件分岐の書き方がわからない
Q&A
Closed
解決したいこと
下記のコードでresultsNumの値が、
①0の場合
②1〜３の場合
③4〜５の場合
のように、各条件によって表示するコンポーネントを切り分けたいです。
ただ、どうやってコードを書けばいいかわからないです。。。
<template>
<v-container>
<v-row>
<v-col class="text-center">
{{ $route.params.id }}点！
</v-col>
</v-row>
<v-row>
<div v-if="resultsNum == 0">
<p>ズバリ0ですね！</p>
</div>
<div v-else-if="">
<p>ズバリ１〜３ですね！</p>
</div>
<div v-else-if="">
<p>ズバリ4〜5ですね！</p>
</div>
</v-row>
<v-row>
<nuxt-link to="/">Topへ戻る</nuxt-link>
</v-row>
</v-container>
</template>
<script>
export default {
data() {
return {
resultsNum: Number(this.$route.params.id),
}
},
}
</script>
resultsNumはこの画面に遷移する
this.$router.push({ name: 'result-last', params: { id: points } })
でparamsで渡しています。
resultsNumは必ず0〜5の値になります。
0