Vue.jsのv-ifディレクティブを説明する

Vue.js

Vue.js 

説明

Vue.jsにおけるディレクティブは、HTML要素に対して特定の動作を指示するために使用されます。

今回は、v-ifディレクティブを説明します。

v-if:要素を表示または非表示にするために使用されます。

<template>
  <div>
    <p v-if="showText">このテキストは、showText が true の場合に表示されます</p>
    <button @click="toggleText">Toggle text</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      showText: true
    }
  },
  methods: {
    toggleText() {
      this.showText = !this.showText
    }
  }
}
</script>

コメント

タイトルとURLをコピーしました