Laravel 5.2 Vue.js計算不起作用

-1

如何顯示由vue返回的對象？各省都好，但城市v-for不起作用。Laravel 5.2 Vue.js計算不起作用

這是我的劍：

<select v-model="ProvinceModel" name="province" id="province" class="border-radius-0 form-control padding-y-0"> 
    <option v-for="province in provinces" value="@{{ province.id }}"> @{{ province.name }} </option> 
</select> 

<select name="city" id="city" class="border-radius-0 form-control padding-y-0"> 
    <option v-for="city in cities" value="@{{ city.id }}"> @{{ city.name }} </option> 
</select>

這是我的腳本

new Vue({ 
     el: '#vue', 
     methods: { 
      fetchProvinces: function() { 
       this.$http.get('{{url('api/provinces')}}').then(function (provinces) { 
        this.$set('provinces', provinces.data) 
       }); 
      } 

     }, 
     computed: { 
      cities() { 
       this.$http.get("{{url('api/cities')}}/" + this.ProvinceModel).then(function (cities) { 
        console.log(cities.data); 
        this.$set('cities', cities.data) 
       }); 

      } 
     }, 
     ready: function() { 
      this.fetchProvinces() 
     }, 
    });

和路由

Route::get('cities/{provinces_id}', function ($id = 8) { 
    return \App\province::find($id)->cities()->get(); 
})->where('id', '[0-9]+');

來源

2016-09-25 Morteza Negahi

就我的問題而言，您並未使用'select2'（https://select2.github.io/）。如果是，請更新問題以反映這一點。 – ceejayoz

@ceejayoz我只需要我的問題解決了，如果你能幫助我的男人。 –

我正在努力幫助您。閱讀我的答案。我給你提供了你需要的信息 – ceejayoz

計算函數應該返回一些東西，並且會同時返回。你沒有任何回報。

您也試圖設置this.cities作爲數據，但this.cities已經是一個計算函數。一個人會覆蓋另一個並導致不一致/混亂的行爲。

異步獲取城市應該是一種方法，就像您的fetchProvinces方法一樣。您應該在ProvinceModel更改時提取它們，您可以通過選擇器上的@change事件或值爲ProvinceModel的Vue觀察器來執行此操作。

^{備註：通常，最好在組件的data參數中定義數據項。如果你檢查你的JS控制檯，Vue可能會拋出警告。}

來源

2016-09-25 13:27:03 ceejayoz

請閱讀這些。 [Link1]（https://github.com/vuejs/vue/issues/3165） [Link2]（https://github.com/vuejs/vue-validator/issues/273） [Link3]（https ：//github.com/vuejs/vue/issues/2064） –

@MortezaNegahi這些都不符合你的情況。 – ceejayoz

但在vue文件中@change不存在！ vue作者說這個事件也許會下降！ –

Vuejs不靈活，你可以通過jQuery的價值，把它傳遞給控制。通過ref方法的元素是很好的。

Vuejs不能等待worker，當它變得忙碌時，當它不在值時顯示爲undefined。

來源

2016-09-25 13:23:20

「Vuejs不靈活」什麼？ – ceejayoz

首先在給出一個負面的評價之前，發現寫什麼！當元素chnage事件的Veujs沒有預料到任何不靈活！我們不使用靜態頁面。我們的頁面動態！ –

@muhamadzolfaghari我仍然完全不清楚你想說什麼。 Vue.js非常靈活，並且完全可以讓兩個選擇框互相交互。 OP想要做的事完全可以在Vue中實現 - 不需要jQuery。 – ceejayoz

Laravel 5.2 Vue.js計算不起作用

回答

相關問題