当前位置: 首页 > Web前端 > vue.js

基于vue的slot类动态布局组件slot-layout

时间:2023-04-01 00:45:13 vue.js

经常需要做一些动态布局,所以自己做了一个vue动态布局组件slot-layout,分享一下。组件地址:https://github.com/hzsrc/slot...安装方法:npmislot-layout该组件基于一个布局配置对象。通过调整布局配置对象,最终映射到对应的vue组件槽。动态布局页面,布局配置更方便。特点通过js布局对象完全控制页面布局。特别适用于低代码平台系统。只需要在运行时根据需要动态传入一个布局配置对象,就可以随意调整页面布局。无需预先编码布局。支持多层布局嵌套,可实现任意层级任意数量的布局。支持任意长度单位,如px、vw、%、rem。支持填充布局。也就是说,块填充父容器。组件自带布局配置功能,可以轻松实现布局设计。使用示例如下:1.简单示例(单层,两个子节点):查看效果:https://codepen.io/hzsrc/pen/...2.复杂示例:查看效果