split-panel

An adjustable split panel component with Vue.js 2. This component is used by project json-schema-editor for website Json Schema Editor.

Install

npm install --save-dev tangramjs-split-panel

Usage

// somewhere
Vue.use(require('tangramjs-split-panel'))

// in your component
components:
  'split-panel': require('tangramjs-split-panel')

<split-panel>
  <!-- contains two named slot: "panel1" and "panel2" for two panels -->
  <div slot="panel1">
    <!-- content of first panel -->
  </div>
  <div slot="panel2">
    <!-- content of second panel -->
  </div>
</split-panel>

Props

Name | type | default | description --- | --- | ---| --- orientation | String | 'vertical' | Determines if the splitter is vertical or horizontal. init-position | Number | - | Determines pixel distance of the splitter from the left or top edge. show-border | Boolean | true | Determines draw border or not. fixed | Boolean | false | Determines if the splitter can move.

License

Copyright (c) 2017 James Huang Licensed under the GPL license.