Vue တွင် ရှုပ်ထွေးသော အခြေအနေများ

v-if directive ထဲတွင် ပို၍ ရှုပ်ထွေးသော အခြေအနေများ ပြုလုပ်နိုင်ပါသည်။ ဥပမာအားဖြင့်၊ num property ထဲတွင် 1၊ 2 သို့မဟုတ် 3 နံပါတ်တစ်ခုခု ရှိနိုင်သည်ဆိုပါစို့။

javascriptdata() {
  return {
    num: 3, // ယခု 3 ရှိသည်ဆိုပါစို့
  }
}

ယခု အပိုဒ်သုံးခုပြုလုပ်ကြပါစို့၊ ၎င်းတို့အနက်မှ num property ၏တန်ဖိုးပေါ် မူတည်၍ တစ်ခုတည်းကိုသာ ပြသမည်။

html<template>
  <p v-if="num === 1">one</p>
  <p v-if="num === 2">two</p>
  <p v-if="num === 3">three</p>
</template>

ပို၍ ရှုပ်ထွေးသော အခြေအနေများကိုလည်း ပြုလုပ်နိုင်ပါသည်။

html<template>
  <p v-if="num === 1 || num === 3">
    one or two
  </p>
</template>