先看效果:
使用方法:
1、npm install fencelayout
2、引入使用
<template><Fencelayout><!-- 需要写的模块直接嵌套在这个下面就可以 --><div class="aaaa"><a-button>模块1</a-button></div><div class="aaaa"><a-button>模块2</a-button></div><div class="aaaa"><a-button>模块3</a-button></div><div class="aaaa"><a-button>模块4</a-button></div><div class="aaaa"><a-button>模块5</a-button></div></Fencelayout>
</template><script setup>
// 开发组件测试页面
import Fencelayout from 'fencelayout'
</script><style lang="less" scoped>
div {width: 100%;height: 100%;.ant-btn {position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}
}
</style>