分裂窗格

参考网站：分裂窗格 (antoniandre.github.io) 代码示例： 第一步：项目中没有这个拖拽插件时候需要先安装

npm i splitpanes@legacy  

第二步：在需要使用的界面导入并注册组件

<script>
import { Splitpanes, Pane } from "splitpanes";
import "splitpanes/dist/splitpanes.css";
export default {
  components: {
    Splitpanes,
    Pane,
  },
  }
</script>

第三步：在组件中使用

<template>
  <div class="app-container home">          
<splitpanes class="default-theme" horizontal :push-other-panes="false" style="height: 400px">
  <pane>
    <span>1</span>
  </pane>
  <pane>
    <splitpanes :push-other-panes="false">
      <pane>
        <span>2</span>
      </pane>
      <pane>
        <span>3</span>
      </pane>
      <pane>
        <span>4</span>
      </pane>
    </splitpanes>
  </pane>
  <pane>
    <span>5</span>
  </pane>
</splitpanes>
  </div>
</template>