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/