use template for Vue 1.x (#5)

weizhenye · weizhenye · commit ab216d3f363b · 2016-11-10T22:04:06.000+08:00
diff --git a/src/create.js b/src/create.js
@@ -1,17 +1,14 @@
 import clone from './clone.js';
 import ctors from './constrators.js';
 
-function create(tagName, Highcharts) {
+function create(tagName, Highcharts, Vue) {
   var Ctor = Highcharts[ctors[tagName]];
   if (!Ctor) {
     return null;
   }
   var isRenderer = tagName === 'highcharts-renderer';
-  return {
+  var component = {
     name: tagName,
-    render: function(createElement) {
-      return createElement('div');
-    },
     props: isRenderer
       ? {
           width: { type: Number, required: true },
@@ -37,9 +34,6 @@ function create(tagName, Highcharts) {
         }
       }
     },
-    mounted: function() {
-      this._initChart();
-    },
     beforeDestroy: function() {
       if (isRenderer) {
         this.$el.removeChild(this.renderer.box);
@@ -50,12 +44,24 @@ function create(tagName, Highcharts) {
       } else {
         this.chart.destroy();
       }
-    },
-    // compat Vue v1.x
-    ready: function() {
-      this._initChart();
     }
   };
+  var isVue1 = /^1\./.test(Vue.version);
+  if (isVue1) {
+    component.template = '<div></div>';
+    component.ready = function() {
+      this._initChart();
+    };
+  } else {
+    component.render = function(createElement) {
+      return createElement('div');
+    };
+    component.mounted = function() {
+      this._initChart();
+    };
+  }
+  return component;
 }
 
 export default create;
+
diff --git a/src/index.js b/src/index.js
@@ -6,7 +6,7 @@ function install(Vue, options) {
   var Highcharts = (options && options.Highcharts) || HighchartsOnly;
   Vue.prototype.Highcharts = Highcharts;
   for (var tagName in ctors) {
-    var component = create(tagName, Highcharts);
+    var component = create(tagName, Highcharts, Vue);
     component && Vue.component(tagName, component);
   }
 }

Original file line number	Diff line number	Diff line change
`@@ -6,7 +6,7 @@ function install(Vue, options) {`
`6`	`6`	`var Highcharts = (options && options.Highcharts) \|\| HighchartsOnly;`
`7`	`7`	`Vue.prototype.Highcharts = Highcharts;`
`8`	`8`	`for (var tagName in ctors) {`
`9`		`- var component = create(tagName, Highcharts);`
	`9`	`+ var component = create(tagName, Highcharts, Vue);`
`10`	`10`	`component && Vue.component(tagName, component);`
`11`	`11`	`}`
`12`	`12`	`}`