JSFiddle - React, Tailwind, and code Playground

by Nicholas Bridgemohan

HTML

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<div id="app">
  <button v-on:click="show=!show">Show/Hide</button>
  <p v-if="show">if visible</p>
  <p v-else>else visible</p>
  <p v-show="show">v show visible</p>
  <hr>
  <ul>
    <li v-for="(per, index) in persons">{{per.name}} - {{index}}</li>
  </ul>
</div>

JavaScript

new Vue({
el:"#app",
data:{
show:true,
persons:[
{name:'max',age:12},
{name:'max1',age:13},
{name:'max2',age:52}
]
}

})