「Vue.js」テンプレート(template)にv-ifディレクティブを使うサンプル

2020年11月26日

構文
<template v-if="条件式">
//some code
</template>

使用例

<div id="app">
    <p v-if="cft">A001</p>
    <template v-if="hanten">
      <h1>B002</h1>
      <p>C003</p>
      <p>D004</p>
    </template>
</div>
<script src="vue/2.2.2/vue.min.js"></script>    
<script>
new Vue({
  el: '#app',
  data: {
    cft: true,
    hanten: true
  }
})
</script>