使用 vue-splitpane 实现页面可拖动改变宽高

安装及注册 vue-splitpane，在main.js 里全局注册

npm install vue-splitpane

#import
import splitPane from 'vue-splitpane'

# use as global component
Vue.component('split-pane', splitPane);

页面中使用

<div className="container">
    <split-pane :min-percent='0' :default-percent='15' split="vertical">
        <template slot="paneL">
            <div className="left-container"/>
        </template>
        <template slot="paneR">
            <split-pane split="horizontal">
                <template slot="paneL">
                    <div className="top-container"/>
                </template>
                <template slot="paneR">
                    <div className="bottom-container"/>
                </template>
            </split-pane>
        </template>
    </split-pane>
</div>