You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

History

doublekou 4fddd39d76 更新		1 year ago
..
demo	更新	1 year ago
dist	更新	1 year ago
src	更新	1 year ago
.babelrc	更新	1 year ago
.eslintignore	更新	1 year ago
.eslintrc.js	更新	1 year ago
README.md	更新	1 year ago
package.json	更新	1 year ago
webpack.config.js	更新	1 year ago

README.md

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

#import
import splitPane from 'vue-splitpane'

# 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="paneL">
        A
      </template>
      <template slot="paneR">
        B
      </template>
    </split-pane>

  //nested
   <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>

Options

Property	Description	type	default
split	the split type	String [horizontal,vertical]	must choose one type
min-percent	paneL max-min-percent	Number	10
max-percent	paneL max-percent	Number	10