Select Box binding in Vue

Last Updated: May 31, 2018

In this example we will see how we can bind the Select Box to Vue

You can have the following Vue instance

var vm= new Vue({
      el: "#root",
      data: {
          days:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],
          selectedday:''
      },
    })

Here, you will have the days array and selectedday to hold the value selected from the select box

Now your HTML code should look as below

 
Selectd Day is : {{selectedday}}

In this HTML code you can see the v-for directive and v-model="selectedday" which will hold the value selected by you

You can have the working demo here