Skip to content

ExpandContainernput ​

一个可以展开收起的容器

源文件 ​

ExpandContainer.vue

ExpandContainer.vue

示例 ​

向下展开 ​

向上展开 ​

采用定位实现,需要设置父类的高度

props 参数 ​

参数名说明类型默认值
expand(v-model)是否展开booleanfalse
height容器收起时的高度string0
position展开方向,可选值为top和bottom,默认为bottomstringbottom
iconSize图标大小,默认为20,单位为像素,用于计算图标位置number20
duration动画时长,默认为0.3snumber0.3

事件 ​

事件名说明参数
expand-change展开状态改变时触发展开状态

插槽 ​

插槽名说明参数
default容器内容插槽-
down没有展开,箭头向下时的图标插槽-
up展开,箭头向上时的图标插槽-

样式 ​

.block-bg ​

这个类名的高度会随着容器的展开而改变,包含了展开图标,用于设置背景

Released under the MIT License.