浏览代码

容器高度

Cyt928 5 年之前
父节点
当前提交
c29c84d71d
共有 1 个文件被更改,包括 3 次插入1 次删除
  1. 3 1
      src/components/Tree.vue

+ 3 - 1
src/components/Tree.vue

@@ -24,7 +24,7 @@
 <!--      @nodeClick="nodeClick"-->
 <!--    />-->
   </div>
-  <canvas id="line-drawer" :height="HEIGHT" :width="WIDTH"></canvas>
+  <canvas id="line-drawer" :height="fitHeight" :width="WIDTH"></canvas>
 </div>
 </template>
 
@@ -127,6 +127,7 @@ export default {
       WIDTH,
       TREE_MAX_HEIGHT,
       NODE_STYLE,
+      fitHeight: 0,
       ctx: null,
     };
   },
@@ -140,6 +141,7 @@ export default {
     },
     drawLine(height) {
       setTimeout(() => {
+        this.fitHeight = height > HEIGHT ? height : HEIGHT;
         this.ctx.clearRect(0, 0, WIDTH, height > HEIGHT ? height : HEIGHT);
         this.ctx.lineWidth = 1;
         this.ctx.strokeStyle = '#bbbbbb';