Laravel 5,3 и Vuejs Ajax вызов на поле выбора

Question

я хочу вновь добавила запись для просмотра на поле выбора, как только новая запись была вставлена ​​в таблице, вот мой Laravel HTML код

<div class="form gorup"> 
     <select class="form-control" > 

       <option @click="called" v-for="task in list" >@{{task.body}}</option> 

     </select> 
</div> 

Здесь это код vue js, который извлекает данные с помощью ajax.

<script> 
    }); 
    new Vue({ 
     el: 'body', 

     data: function(){ 
     return{ 
      list:[] 
     }; 
     }, 
     methods: { 

      called: function(){ 

       $.getJSON('api/tasks', function (tasks) { 
        this.list = tasks; 
        console.error(); 
       }.bind(this)); 

      }, 
     }, 
    }); 

</script> 

здесь код из функции Laravel маршрута, который производит элементы задачи

Route::get('api/tasks', function(){ 

return App\Task::latest()->get(); 

});

Так что моя идея заключается в том, что если пользователь нажимает на поле выбора выполняется код Ajax, извлекает запись и отображают данные в <option></option> тегах

Answer 1

есть лучший способ, чтобы сделать код работу лучше, потому что в настоящее время i нужно дважды щелкнуть поле выбора, чтобы оно извлекало новые данные. ?

Почему не после того, как вы смонтированы (готовы) или вставьте новые данные (новый список) и просто потяните туда новые записи и вставьте их в свои задачи this.list =;

new Vue({ 
data : { 
list = [] 
}, 

ready : function(){ 
    this.initialize(); 
}, 
methods : { 

initialize : function(){ 
    let self = this; 
    $.get('url',function(response) 
     { 
      self.list = response.task 
     } 

}, 
createNewTask: function(){ 
     let self = this; 
     $.post('url',{data},function(response) 
      { 
       self.list = response.task 
      } 

    } 

} 
}) 

вы не должны положить АЯКС тянуть с вашего выбора коробки, как он будет потреблять время, чтобы тянуть новые данные с сервера и поместить его в список вашего массива

.