title: select menu does not populate the top area if I have a v-model on it
body: <p>I am using vuejs and have a basic select menu that works fine.Issue is as soon as i add a v-model, the default name that says &quot;choose option&quot; disappear. Anyway to avoid this from happening, I tried populating the empty array with some text, but it still doesnt make any text display in the select menu label area.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>new Vue({
    el: "#app",
    data: {
     selections:[]
    },
    methods: {
      toggle: function(todo){
          todo.done = !todo.done
      }
    }
  })</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"&gt;&lt;/script&gt;
  &lt;div id="app"&gt;
    &lt;h2&gt;Todos:&lt;/h2&gt;
  &lt;select id="test"class="form-control" v-model="selection"  style="width: 110px;"&gt;
    &lt;option value="Select a option" selected disabled&gt;Choose an area:&lt;/option&gt;
      &lt;option v-for="t in todos" :value="a"&gt;{{ t.name }}&lt;/option&gt;
  
  &lt;/select&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>