Vue에서 복잡한 조건
v-if 지시문에서는
더 복잡한 조건을 만들 수 있습니다. 예를 들어,
num 속성에
1, 2 또는
3 숫자 중 하나가 있을 수 있다고 가정해 보겠습니다:
data() {
return {
num: 3, // 현재는 3이라고 가정
}
}
이제 num 속성 값에 따라
하나만 표시될 세 개의 단락을 만들어 봅시다:
<template>
<p v-if="num === 1">one</p>
<p v-if="num === 2">two</p>
<p v-if="num === 3">three</p>
</template>
더 복잡한 조건도 만들 수 있습니다:
<template>
<p v-if="num === 1 || num === 3">
one or two
</p>
</template>
day 속성이 주어졌으며, 여기에는 현재 요일이 기록되어 있습니다.
또한 각각에 요일 이름이 적힌 일곱 개의 단락이 있다고 가정합니다.
화면에 현재 요일 이름을 포함하는 단락만 보이도록 하세요.
