Condições Complexas no Vue
Na diretiva v-if, é possível criar
condições mais complexas. Suponha, por exemplo,
que a propriedade num possa
conter um dos números 1, 2 ou
3:
data() {
return {
num: 3, // vamos supor que seja 3 agora
}
}
Agora, vamos criar três parágrafos, dos
quais apenas um será exibido
dependendo do valor da
propriedade num:
<template>
<p v-if="num === 1">um</p>
<p v-if="num === 2">dois</p>
<p v-if="num === 3">três</p>
</template>
Também é possível criar condições mais complexas:
<template>
<p v-if="num === 1 || num === 3">
um ou três
</p>
</template>
Dada a propriedade day, que contém
o dia da semana atual. Suponha que você também tenha
sete parágrafos, em cada um dos quais está escrito
o nome de um dia da semana. Faça com que apenas o parágrafo
que contém o nome do dia da semana atual
seja visível na tela.
