VueJS - Conditions and Loops

Conditions & Loops in template are as follows :

v-if  : It will apply "if" condition in the html template.
     Ex : In index.html
<div id="vueapp"><div v-if="main">
If condition applied</div></div>
    Ex : In index.js


   

    var app = new Vue({
    el: '#vueapp',
    data: {
           main: true
      }
    })



v-for : It will allow applying  "for" loop in the html, mainly used to display the data from an array.
Ex : In index.html
   

 var app = new Vue({
    el: '#vueapp',
    data: {
      main: true
    }
  })
 
   Ex : In index.js


    var app = new Vue({
            el: '#vueapp',
            data: {
             dataarr: [
             { name: 'Rahul' },
             { name: 'Dinesh' },
             { name: 'Kunal' }
           ]
       }
    })