%20(2).svg)
项目简介
本项目是基于Vue框架开发的UI布局系统，为开发者提供了一套易于使用、功能丰富且灵活可配置的UI布局框架，能够助力开发者快速搭建出美观、响应式的Web应用界面。
项目的主要特性和功能
- 丰富组件库：包含左右布局样式组件、过渡动画组件等多种常用UI组件，满足大部分开发需求。
- 响应式设计：支持响应式布局，自动适配不同尺寸屏幕，提升用户体验。
- 状态管理：集成Vuex，提供全面的状态管理方案。
- HTTP客户端：封装axios实例对象，统一处理请求参数与异常错误。
- 字体图标数据：提供
Font Awesomev4.7 版本的字体图标数据集，方便选择图标。 - 过渡动画：封装常用过渡动画组件，基于
Velocity.js实现。 - 点击事件扩展：对Vue组件扩展
v-clickoutside命令，处理元素外部点击事件。
安装使用步骤
前提条件
假设用户已经下载了本项目的源码文件。
安装依赖
在项目根目录下，运行 npm install 或 yarn 来安装所需依赖。
配置依赖
在 package.json 中添加依赖：
bash
"@archser/layout-ui": "git+http://gitlab.archser.com/QingDaoPSB/layout-ui-develop.git"
导入框架UI组件
导入框架UI的入口函数和样式：
js
import { layout } from '@archser/layout-ui'
import '@archser/layout-ui/dist/layout-ui.css'
运行框架UI组件
js
layout(routeConfig, storeConfig, appConfig)
- routeConfig：参考 这里。顶层路由存在子路由时无需执行 component 属性。
- storeConfig：参考 这里，建议仅定义自己的 modules 然后合并到框架内部。
- appConfig：包含应用名称、logo、中文名称、cookie 超期时间等配置项。示例如下：
js
{
app: 'aserver',
logo: '/logo.png',
name: '目录',
cookieExpires: 1
}
启动项目
运行 npm run serve 或 yarn serve 启动项目。
下载地址
点击下载 【提取码: 4003】【解压密码: www.makuang.net】