如何在DOM更改後更新Vue數據

Question

我正在使用jQuery可排序插件以及VueJS。該插件更改DOM，但這些更改未反映在我的組件數據對象上。

我有一個對象數組，呈現爲列表<li>在HTML中。可排序的插件更改這些列表項目的順序，但vue組件數組順序未更改。

任何幫助？

Answer 1

有一個特殊的第三方Vue公司的組件，負責可排序的整合與Vue.js：https://github.com/SortableJS/Vue.Draggable

這也可能是最好的使用而不是試圖做你自己這一點。

Answer 2

通過將組件實例聲明爲變量來獲取Vue實例。

var vm = new Vue({ 
el: '#app', 
components: { 
    'my-component': { 
     template: '#my-template', 
     data: function() { 
      return { 
       list: [], 
      }; 
     }, 
     ... 
    }, 
}, 

這樣你也可以訪問實例外的數據。只需根據您收聽的更改更新數據即可。 Like vm.list = [];）