vue-splitpane-v2
v2.0.1
Published
vue split-pane component
Downloads
3
Readme
Vue Split Pane
Split-Pane component built with vue2.0, can be split vertically or horizontally.
Try the demo
How to use?
npm install vue-splitpane-v2
#import
import splitPane from 'vue-splitpane-v2'
# use as global component
Vue.component('split-pane', splitPane);
Example
<split-pane v-on:resize="resize" :min-percent='20' :default-percent='30' split="vertical">
<template slot="area1">
A
</template>
<template slot="area2">
B
</template>
</split-pane>
//nested
<split-pane v-on:resize="resize" :min-percent='20' :default-percent='30' split="vertical">
<template slot="area1">
A
</template>
<template slot="area2">
<split-pane split="horizontal">
<template slot="area1">
B
</template>
<template slot="area2">
C
</template>
</split-pane>
</template>
</split-pane>
Options
| Property | Description | type | default | | ----------------- | ---------------- | :--------: | :----------: | | split | the split type |String [horizontal,vertical] |must choose one type | | min-percent | area1 max-min-percent |Number | 10 | | max-percent | area1 max-percent |Number | 10 |