Vue Split Pane的使用，以及max-percent不生效的问题

前端李小白

于 2021-04-15 10:23:07 发布

阅读量2.1k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： vue 文章标签： splitPane

本文链接：https://blog.youkuaiyun.com/qq_42268364/article/details/115717036

本文介绍了Vue Split Pane的使用方法，包括简单的左右分割和复杂的多列模式，并指出max-percent配置项在实际中未生效的问题。为解决这一问题，文章提供了一个通过监听resize事件并自定义控制pane最大值的方案，帮助读者实现类似max-percent的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

使用demo

使用方式

npm install vue-splitpane

#import
import splitPane from 'vue-splitpane'

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

使用例子：简单的左右分割

 <split-pane v-on:resize="resize" :min-percent='20' :default-percent='30' split="vertical">

200万优质内容无限畅学