Не удается получить данные из элемента выбора vue.js

Question

Я пробовал разные методы, чтобы сделать выбор данных из элемента select работающим, но все еще возникают проблемы, то есть я не могу связать его с моделью.Единственный способ сделать это раньше - использовать v-if, но элемент select теряет css styling.Элемент select заполняется динамически, и я попробовал другой метод, и я застрял с этим на данный момент.

new Vue({
    el: '#app',
    data: {
      title: "",
      examType: "",
      classes: "",
      subjects: "",
      subjs:[],
      ndata:"",
      typeOptions: [
                @foreach($types as $t) 
                    { text: '{{@$t->title}}', value: '{{@$t->id}}' },
                @endforeach
            ]
    }
  });

Выбрать элемент

<div class="row">
  <div class="col-md-6 col-md-offset-3">
   <div class="form-group">
    <label>Exam Type: <span class="text-danger">*</span></label>
    <select name="examType" data-placeholder="Exam Type" class="select required" v-model="examType" >
      <option></option>
      <option v-for="p in typeOptions" v-bind:value="p.value">@{{ p.text }}</option>
     </select>
    </div>
   </div>
  </div>

На данный момент об ошибке не сообщается на консоли.Как я могу получить выбранные данные из элемента выбора?