🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
# :-: 前端配置说明 ## 业务配置 除了 setting.env.js 配置外,还有另外一个配置,即`src/setting.js`配置,基本上绝大部分的配置都在这个文件里完成。使用者可根据自己的 UI 习惯来修改不同的配置,从而实现不同的布局效果。 详细的配置介绍如下: ### 基础配置 * **titleSuffix**:网页标题的后缀,配置后,每个页面的标题都会带有后缀,比如 "业务配置 - iView Admin Pro",为空则不显示后缀 * **routerMode**:路由模式,可选值为 history 或 hash,默认为`history` * `2.2.0`**routerBase**:应用的基路径。例如,如果整个单页应用服务在 /app/ 下,然后 routerBase 就应该设为 '/app/'。默认为`/` * **showProgressBar**:页面切换时,是否显示模拟的进度条,默认为`true` * **apiBaseURL**:统一的接口请求地址,可根据当前环境配置不同的值 * **modalDuration**:接口请求返回错误时,弹窗的持续时间,单位:秒,默认`3` * **errorModalType**:接口请求返回错误时,弹窗的类型,可选值为 Message 或 Notice,默认`Message` * **cookiesExpires**:Cookies 默认保存时间,单位:天,默认`1` ### 多语言配置`1.2.0` * **i18n**: * **default**:默认语言,默认为简体中文,值为`zh-CN` * **auto**:是否根据用户电脑配置自动设置语言(仅第一次有效),默认`false` ### 布局配置 * **menuSideWidth**:侧边菜单宽度,单位 px,不可动态修改,如若修改,需同时修改`src/styles/setting.less`文件的 @menuSideWidth 且数值保持一致,默认`256` * **layout**:布局配置,如下: * **siderTheme**:侧边栏风格,可选值为 dark 或 light,默认`dark` * **headerTheme**:顶栏风格,可选值为 light、dark 或 primary,默认`light` * **headerStick**:顶栏是否置顶,开启后顶栏会覆盖在侧边栏之上,需开启 headerFix,默认`false`,建议在有顶级菜单时使用 * **tabs**:是否开启多 Tabs 页签,默认`true` * **showTabsIcon**:多 Tabs 页签是否显示图标,开启 tabs 时有效,默认`true` * **tabsFix**:是否固定多 Tabs 多页签,开启 tabs 时有效,默认`true` * `2.2.0`**tabsReload**:再次点击 Tabs 当前页签时,是否重载当前页面,默认`false` * **siderFix**:是否固定侧边栏,默认`true` * **headerFix**:是否固定顶栏,默认`true` * **headerHide**:是否在下滑时隐藏顶栏,需开启 headerFix,如果开启了 tabsFix,Tabs 也会被隐藏,默认`false` * **headerMenu**:是否显示顶部菜单栏,一般来说,侧边的菜单栏足以满足大部分业务,如需动态切换侧边栏,可开启此选项启用顶部一级菜单,此时侧边栏将作为二级菜单,默认`false` * **menuAccordion**:侧边菜单栏是否开启手风琴模式,默认`true` * **showSiderCollapse**:是否显示折叠侧边栏按钮,移动端下会自动强制开启,默认`true` * **menuCollapse**:侧边菜单栏是否默认折起,默认`false` * `2.2.0`**menuSiderReload**:再次点击当前侧边菜单时,是否重载当前页面,默认`false` * `2.2.0`**menuHeaderReload**:再次点击当前顶部菜单时,是否重载当前页面,默认`false` * `1.2.0`**showCollapseMenuTitle**:侧边菜单折起时,是否在子菜单前显示父级菜单名称,默认`false` * `1.2.0`**showReload**:是否显示重载按钮,默认`true` * **showSearch**:是否显示搜索,默认`true` * **showNotice**:是否显示通知,默认`true` * **showFullscreen**:是否显示全屏,默认`true` * **showMobileLogo**:在手机访问时,是否在顶部显示小尺寸 logo,默认`true` * **showBreadcrumb**:是否显示全局面包屑,开启 headerMenu 时不可用(如若在开启 headerMenu 时显示,可以在页面中的 PageHeader 使用该组件) * **showBreadcrumbIcon**:全局面包屑是否显示图标,开启 showBreadcrumb 时有效,默认`false` * **showLog**:是否显示日志入口,开启与否,不影响日志记录,如不希望用户看到可关闭,默认`true` * `1.2.0`**showI18n**:是否显示多语言切换按钮,默认`true` * **enableSetting**:是否支持动态修改布局配置,移动端下会自动强制关闭,此功能主要用于开发阶段实时预览各种布局效果,建议在生产环境关闭,默认`true` * **logoutConfirm**:退出登录时,是否二次确认,默认`true` ### 多页 Tabs * **page**:配置如下: * **opened**:默认打开的页签,默认`[]` ### 功能配置 * `2.1.0`**sameRouteForceUpdate**:相同路由,不同参数间进行切换,是否强力更新,默认为`false`。 > 说明:由于 vue-router 限制,相同路由,不同参数,进行切换时,组件并不是重新加载,而是共享,这会导致切换时,数据状态并没有重置。开启该选项后,在两个相同路由,不同参数间切换时,页面会重载。 > 说明:使用该功能,该页面在路由配置时,必须设置`name`字段。 * `1.3.0`**dynamicSiderMenu**:是否使用动态侧边菜单,默认为`false`。 > 说明:框架默认是在`main.js`中获取本地侧边菜单的,开启该选项,则认为是从服务端动态获取侧边菜单,系统将不再主动获取本地菜单,而相关菜单获取逻辑,需开发者自己完成。详见文档**基础功能-添加菜单**。 > 其中,绝大部分布局配置都支持动态配置并实时更新效果。