通过渲染主题

Question

可以说我有（在地图上的位置）的阵列，我环路后如何诉诸组件：

<div class="row" v-for="place in places"> 
     <place :place="place" v-if="place.distance"></place> 
</div> 

后的分量被呈现我的页面。该数组得到更新，所以我想在数组更新后重新排列我的页面中的组件。 是有办法做到这一点，或者只是停止组件，直到阵列进行更新（我呼吁谷歌的geolocalisation），然后（通过位置之间的距离排序）

Answer 1

使他们在正确的顺序作为注释掉，你不不需要为此做任何事情，vue包装观察数组的突变方法，以便它们也将触发视图更新，如解释here。被包装的方法有：

• 推（）
• 弹出（）
• 移（）
• 不印字（）
• 剪接（）
• 排序（）
• 反向（）

你可以在这里看到工作演示如何重排h出现here。

样品JS代码：

Vue.component('comp2', { 
    props: ['title'], 
    template: '#comp2' 
}) 

new Vue({ 
    el: '#app', 
    data: { 
    compArray: ['comp1', 'comp2', 'comp3'] 
    }, 
    methods: { 
    resuffle: function() { 
     this.compArray.splice(0,1) 
     this.compArray.push(this.compArray[0]) 
    } 
    }, 
}) 

相关HTML：

<div v-for="comp in compArray"> 
     <comp2 :title="comp"> 
    </div>