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计算不起作用

回答

相关问题