將數據從Vue.js請求傳遞給Laravel 5.3表單

Question

我有兩個表：國家和城市。想法是顯示第二個下拉菜單，當用戶選擇國家並填寫與選定國家對應的城市時。

不幸的是我不知道如何通過檢索值來形成。檢索

值均爲全國下面編號21是挪威:)

選擇{ 「國」： 「21」， 「CountrySelected」：真正的 「城市」：{ 「6」： 「奧斯陸」， 「11」： 「利勒哈默爾」}}

// My app.js 
 

 
const app = new Vue({ 
 

 

 
el: '#events', 
 

 
    data: { 
 
\t \t country:'', 
 
\t \t CountrySelected: false, \t 
 
\t \t cities:[], \t 
 
    }, 
 

 
    methods: { 
 

 
\t \t WhenCountryHasBeenSelected: function(event) { 
 
\t \t \t this.getCities(); 
 
\t \t \t this.CountrySelected= true; 
 
\t \t }, 
 

 
\t \t getCities: function(){ 
 
\t \t \t this.$http.get('api/cities/'+this.country).then(function (response) { 
 
     this.cities = response.data; 
 
     }); 
 
    } 
 
    }, 
 

 
})

//My api.php routes 
 

 
Route::get('/cities/{country_id}', function (Request $request, $country_id) { 
 
\t \t 
 
$cities=App\City::where('country_id', $country_id)->get()->pluck('name','id'); 
 

 
return $cities; 
 
}); 
 

 

 
//My blade file 
 

 
@extends('layouts.app') 
 

 
@section('content') 
 
<div class="container"> 
 
    <div class="row"> 
 
     <div class="col-md-8 col-md-offset-2"> 
 
     <div id="events"> 
 
      <div class="panel panel-default"> 
 
       <div class="panel-heading">Select cities by country</div> 
 

 
       <div class="panel-body"> 
 

 

 
        {!! Form::open() !!} 
 

 

 
        {!! Form::select('country', $countries, null, ['v-model'=>'country', '@change'=>'WhenCountryHasBeenSelected' ,'class'=>'form-control']) !!} 
 
        
 
        <div v-show="CountrySelected"> 
 
        {!! Form::select('city',$cities, null, ['class'=>'form-control']) !!} 
 
        {!! Form::close() !!} 
 

 
        
 
        Selected @{{ $data | json }} 
 
       
 
       </div> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </div> 
 
</div> 
 
@endsection

Answer 1

端爲使用Laravel收集地圖功能。現在穆路線是這樣的

Route::get('/cities/{country_id}', function (Request $request, $country_id) { 
     $collection=App\City::where('country_id', $country_id)->get(); 
     $cities=$collection->map(function($city){ 
      return ['id' => $city->id, 'name' => $city->name]; 
      })->toArray(); 

萬歲Laracast論壇和巴希:)