title: Default select value not displaying in vue
body: <p>Hi all I'm not able to select a default value for the select dropdown on <code>v-model="selected_fields[item]"</code>. I've run the gauntlet of articles but I'm only able to get it to work on a simple select dropdown I have below for <code>v-model="selected"</code> when I set it to "". For all intensive purposes, the application works with the mapped fields that I need to save. Its just showing a default value <code>Choose Data Field</code> to the user that I'm getting stuck on.</p>
  
  <p><a href="https://i.stack.imgur.com/gVEZk.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/gVEZk.png" alt="enter image description here"></a></p>
  
  <pre><code>@file_fields = ["Event",
   "First Name",
   "Last Name",
   "Company",
   "Job Title",
   "Ticket",
   "Mobile number",
   "Prefix (Mr., Mrs., etc.)",
   "Industry",
   "Google+ Page",
   "Skype ID",
   "Twitter Handle",
   "Job Function",
   "Work Phone Number",
   "Email Address",
   "Profile Image",
   "Linkedin page",
   "Facebook page",
   "Date of Birth",
   "Street Address",
   "City",
   "State",
   "Zip Code",
   "Country",
   "Company Website",
   "Work Phone"]
  
  @default_selected = Hash[@file_fields.map{ |x,i| [x, ''] }]
  
  &lt;div id="mapping"&gt;
    &lt;div v-for="(item, index) in file_fields" class="row mapping-field"&gt;
      &lt;div class="col-6"&gt;
        &lt;select v-model="selected_fields[item]" class="form-control select"&gt;
          &lt;option value="" disabled&gt;Choose Data Field&lt;/option&gt;
          &lt;option v-for="(value, key, index) in mapped_fields" v-bind:value="key"&gt;{{value}}&lt;/option&gt;
        &lt;/select&gt;
      &lt;/div&gt;
      &lt;div class="col-6"&gt;
        &lt;table&gt;
          &lt;% if @header %&gt;
            &lt;thead&gt;
              &lt;tr&gt;
                &lt;th&gt;
                  {{item}}
                &lt;/th&gt;
              &lt;/tr&gt;
            &lt;/thead&gt;
          &lt;% end %&gt;
          &lt;tbody&gt;
            &lt;tr v-if="preview_data[0][item]"&gt;
              &lt;td&gt;
                {{preview_data[0][item]}}
              &lt;/td&gt;
            &lt;/tr&gt;
            &lt;tr v-else&gt;
              &lt;td&gt;
                N/A
              &lt;/td&gt;
            &lt;/tr&gt;
            &lt;tr v-if="preview_data[1][item]"&gt;
              &lt;td&gt;
                {{preview_data[1][item]}}
              &lt;/td&gt;
            &lt;/tr&gt;
            &lt;tr v-else&gt;
              &lt;td&gt;
                N/A
              &lt;/td&gt;
            &lt;/tr&gt;
          &lt;/tbody&gt;
        &lt;/table&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;br/&gt;
    &lt;button class="btn btn-outline-primary" v-on:click="saveMapping" v-bind:disabled="isSelected"&gt;Next&lt;/button&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
    new Vue({
      el: '#mapping',
      data: {
        selected_fields: &lt;%= raw @default_fields.to_json %&gt;,
        mapped_fields: {
          first_name:          'First Name',
          last_name:           'Last Name',
          job_title:           'Job Title',
          email:               'Email',
          company_agency_name: 'Company/Agency Name',
          address_1:           'Address',
          city:                'City',
          state:               'State',
          zip_code:            'Zip Code',
          main_phone:          'Phone',
          website:             'Website'
        },
        preview_data: &lt;%= raw @preview_data.to_json %&gt;,
        file_fields: &lt;%= raw @file_fields.to_json %&gt;
      },
      computed: {
        isSelected: function () {
          return _.isEmpty(this.selected_fields);
        }
      },
      methods: {
        saveMapping: function() {
          this.$http.post('/order/&lt;%= @uuid %&gt;/save_field_mapping', { selected_fields: this.selected_fields }).then(function (response) {
            window.location.href = response.body.next_path;
          }, function (response) {
            console.log('error:', response.body);
          });
        }
      }
    });
  &lt;/script&gt;
  </code></pre>
  
  <p><strong>UPDATED</strong></p>
  
  <p>updated code to working example. Needed to remap @file_fields to hash so each key would have value of "". Then assigned to selected_fields. Originally it was set to {}. Thanks to @daniloisr for the inspiration!</p>