提交

src/components/chart/combination/bar-line-chart.vue

@@ -77,14 +77,7 @@ export default {
     // 颜色
     color: {
       type: Array,
-      default: () => [
-        "#323E6F",
-        "#1DA0D7",
-        "#02BB4C",
-        "#DB5520",
-        "#EDB32F",
-        "#EDEB2F",
-      ],
+      default: () => ["#323E6F", "#1DA0D7", "#02BB4C", "#DB5520", "#EDB32F", "#EDEB2F"],
     },
     // 每页显示个数
     pageSize: {
@@ -250,8 +243,9 @@ export default {
         ],
         series: [],
       };
-      // bar data
-      if (this.bardata.legend && this.bardata.legend.length) {
+
+      if (this.bardata && this.bardata.legend)
+        // bar data
         for (var i = 0; i < this.bardata.legend.length; i++) {
           option.series.push({
             name: this.bardata.legend[i],
@@ -265,7 +259,6 @@ export default {
             data: this.bardata.data[i],
           });
         }
-      }
 
       // line data
       if (this.lineData.length > 0) {
@@ -289,8 +282,8 @@ export default {
   },
   created() {
     this.id = "pie-chart-" + util.newGUID();
-    this.areaData = this.bardata.area;
     if (this.bardata.area && this.bardata.area.length < this.pageSize) {
+      this.areaData = this.bardata.area;
       for (let i = this.bardata.area.length; i <= this.pageSize; i++) {
         this.areaData.push("");
       }
@@ -308,6 +301,16 @@ export default {
       this.initChart();
     });
   },
+  watch: {
+    bardata(val) {
+      if (val.area && val.area.length < this.pageSize) {
+        this.areaData = val.area;
+        for (let i = val.area.length; i <= this.pageSize; i++) {
+          this.areaData.push("");
+        }
+      }
+    },
+  },
 };
 </script>