調用jQuery的動畫scrollTop的類vue.js

Question

我一個FAQ頁面上正與vue.js

這裏切換後的例子至今：

<li v-for="i in items | searchFor searchString" 
v-on:click="toggleCollapse(i)" 
:class="{ collapsed: i.collapse, expanded: !i.collapse }" 
> 
<p><strong>{{i.q}}</strong></p> 
<p>{{i.a}}</p> 
</li> 


var vm = new Vue({ 
el: 'body', 
data: { 
    items:[ 
    {q:"test1", a:"a1", collapse:true}, 
    {q:"test2", a:"a2", collapse:true}, 
    {q:"test3", a:"a3", collapse:true}, 
    {q:"test4", a:"a4", collapse:true}, 
    {q:"test5", a:"a5", collapse:true}, 
    {q:"test6", a:"a6", collapse:true} 
    ] 
}, 
methods: { 
    toggleCollapse: function(i) { 
    var self = this; 
    if(i.collapse){ 
    self.items.forEach(function(a) { 
    a.collapse = true; 
    }); 
    i.collapse = false;  
    }else{ 
    i.collapse = true;  
    }  
    } 
} 
}); 

當上的一個用戶點擊項目，該項目將被擴大。其餘的將會崩潰。

我想調用一個jQuery的動畫scrollTop函數來滾動到用戶點擊後的擴展項目。

我已經嘗試vue實例，如手錶，準備好，安裝，更新等，但他們noe似乎工作。

任何想法？

Answer 1

我找到了解決辦法，nextTick willdo：

methods: { 
    toggleCollapse: function(i) { 
    var self = this; 
    if(i.collapse){ 
    self.items.forEach(function(a) { 
    a.collapse = true; 
    }); 
    i.collapse = false;  
    }else{ 
    i.collapse = true;  
    } 
    this.$nextTick(function(){ 
    //command here 
    })  
    } 
}