V-斗篷的Vue.js生命周期掛鈎

Question

我正在一個項目中，其中v斗篷的樣式為display: none ，並裝飾身體。 這意味着一切都將被隱藏，直到Vue實例准備就緒為止。

我已經制作了一個插入圖表的組件（使用highcharts ）。 組件已插入ready ，但圖表無法正確顯示。

這是一個演示問題的jsfiddle 。

我可以通過輪詢直到顯示元素來解決該問題，但是還有更優雅的解決方案嗎？

Answer 1

使用Vue的nextTick注入圖表，這將確保DOM准備更新：

ready: function() {
  this.$nextTick(function() {
        this.chart = new Highcharts.Chart(this.opts);
  });
}

http://jsfiddle.net/crabbly/hje7bqrn/