Vue में रिएक्टिव कंडीशन

आइए condition को reactive बनाते हैं। उदाहरण के लिए, एक बटन पर क्लिक करने पर element छिप जाए। मान लें कि हमारे पास निम्नलिखित पैराग्राफ है:

App.vue<template>
  <p v-if="visible">text</p>
</template>

आइए हमारा पैराग्राफ शुरू में दिखाई दे रहा हो:

javascriptdata() {
  return {
    visible: true,
  }
}

अब एक बटन बनाएं, जिस पर क्लिक करने पर पैराग्राफ छिप जाए:

App.vue<template>
  <button @click="hide">hide</button>
  <p v-if="visible">text</p>
</template>

बाउंड method visible property को false में बदल देगा, जिससे हमारा पैराग्राफ छिप जाएगा:

javascriptmethods: {
  hide: function() {
    this.visible = false;
  }
}