vue---splitpane分割


使用splitpane可以對窗口進行拆分,這個splitpane組件還是比較好用的,

首先安裝:

npm install vue-splitpane

引入使用:

import splitPane from 'vue-splitpane'
Vue.component('split-pane', splitPane);

分割成兩列:

<split-pane v-on:resize="resize" :min-percent='20' :default-percent='30' split="vertical">
  <template slot="paneL">
    A
  </template>
  <template slot="paneR">
    B
  </template>
</split-pane>

分割成三列:

<split-pane v-on:resize="resize" :min-percent='20' :default-percent='30' split="vertical">
  <template slot="paneL">
    A
  </template>
  <template slot="paneR">
    <split-pane split="horizontal">
      <template slot="paneL">
       B
      </template>
      <template slot="paneR">
        C
      </template>
    </split-pane>
  </template>
</split-pane>

參考文檔:https://www.npmjs.com/package/vue-splitpane


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM