27.md 6.2 KB

技术文档

打开导航菜单

PIG AI Guide

切换主题搜索

[](https://wwads.cn/click/bait)[![](https://cdn.wwads.cn/creatives/HYKVsnrmfPfixKqkTmAG9VrkVFraIps5tqkbEE8n.jpg) ](https://wwads.cn/click/bundle?code=9jV4U87gm2l5qP0HxzCu8wLpUQUQrP)

注册亚马逊云服务免费套餐🆓可享高达200美元抵扣金🚀包括免费使用精选服务🎉广告

PIGX 技术指南

适配 5.0 以上单体和微服务版本

PIGX 技术指南PIG

⌘K

参与开发

快速上手

前端部分

浏览器兼容性前端配置项说明前端ENV环境配置前端目录结构前端首页组件开发前端国际化配置前端字体图标配置前端图表功能前端权限管理前端数据状态管理前端组件路由管理前端标签页管理前端字典工具使用前端参数工具使用前端通用工具函数省市区街四级联动组件前端代码编辑组件前端富文本组件前端表格组件前端表格分页组件前端表格工具栏组件前端上传组件前端左侧查询树前端文字提示组件前端悬浮输入组件前端组织架构组件前端标签列表组件前端表单校验

功能使用

后端部分

扩展必看

生产部署

社区分享

更新日志

更新日期: 2025-10-23

最后更新: 2025/8/19

切换主题

前端配置项说明

配置文件:src/stores/themeConfig.ts

  • 1、需要每次都清理 window.localStorage 浏览器永久缓存
  • 2、或者点击布局配置最底部 一键恢复默认 按钮即可看到效果
配置项 默认值 描述

isDrawer

|

false

|

是否开启布局配置抽屉

| |

primary

|

#2E5CF6

|

全局主题默认 primary 主题颜色

| |

isDark

|

false

|

是否开启深色模式

| |

topBar

|

#ffffff

|

顶栏设置默认顶栏导航背景颜色

| |

topBarColor

|

#606266

|

顶栏设置默认顶栏导航字体颜色

| |

isTopBarColorGradual

|

false

|

顶栏设置是否开启顶栏背景颜色渐变

| |

menuBar

|

#FFFFFF

|

菜单设置默认菜单导航背景颜色

| |

menuBarColor

|

#505968

|

菜单设置默认菜单导航字体颜色

| |

menuBarActiveColor

|

rgba(242...

|

菜单设置默认菜单高亮背景色

| |

isMenuBarColorGradual

|

false

|

菜单设置是否开启菜单背景颜色渐变

| |

columnsMenuBar

|

#545c64

|

分栏设置默认分栏菜单背景颜色

| |

columnsMenuBarColor

|

#e6e6e6

|

分栏设置默认分栏菜单字体颜色

| |

isColumnsMenuBarColorGradual

|

false

|

分栏设置是否开启分栏菜单背景颜色渐变

| |

isColumnsMenuHoverPreload

|

false

|

分栏设置是否开启分栏菜单鼠标悬停预加载(预览菜单)

| |

isCollapse

|

false

|

界面设置是否开启菜单水平折叠效果

| |

isUniqueOpened

|

true

|

界面设置是否开启菜单手风琴效果

| |

isFixedHeader

|

false

|

界面设置是否开启固定 Header

| |

isFixedHeaderChange

|

false

|

初始化变量,用于更新菜单 el-scrollbar 的高度,请勿删除

| |

isClassicSplitMenu

|

false

|

界面设置是否开启经典布局分割菜单(仅经典布局生效)

| |

isLockScreen

|

false

|

界面设置是否开启自动锁屏

| |

lockScreenTime

|

30

|

界面设置开启自动锁屏倒计时(s/秒)

| |

isShowLogo

|

true

|

界面显示是否开启侧边栏 Logo

| |

isShowLogoChange

|

false

|

初始化变量,用于 el-scrollbar 的高度更新,请勿删除

| |

isBreadcrumb

|

true

|

界面显示是否开启 Breadcrumb,强制经典、横向布局不显示

| |

isTagsview

|

true

|

界面显示是否开启 Tagsview

| |

isBreadcrumbIcon

|

false

|

界面显示是否开启 Breadcrumb 图标

| |

isTagsviewIcon

|

false

|

界面显示是否开启 Tagsview 图标

| |

isCacheTagsView

|

true

|

界面显示是否开启 TagsView 缓存

| |

isSortableTagsView

|

true

|

界面显示是否开启 TagsView 拖拽

| |

isShareTagsView

|

false

|

界面显示是否开启 TagsView 共用

| |

isFooter

|

true

|

界面显示是否开启 Footer 底部版权信息

| |

isGrayscale

|

false

|

界面显示是否开启灰色模式

| |

isInvert

|

false

|

界面显示是否开启色弱模式

| |

isWartermark

|

true

|

界面显示是否开启水印

| |

wartermarkText

|

PigX

|

界面显示水印文案

| |

quickLinkNum

|

12

|

首页快捷导航数量上限

| |

tagsStyle

|

tags-style-five

|

其它设置 Tagsview 风格,默认 tags-style-five

| |

animation

|

slide-right

|

其它设置主页面切换动画,默认 slide-right

| |

columnsAsideStyle

|

columns-round

|

其它设置分栏高亮风格,默认 columns-round

| |

columnsAsideLayout

|

columns-vertical

|

其它设置分栏布局风格,默认 columns-horizontal

| |

layout

|

defaults

|

布局设置,默认 defaults

| |

isRequestRoutes

|

true

|

后端控制路由是否开启

| |

globalTitle

|

PIGX ADMIN

|

全局网站标题 / 副标题-网站主标题(菜单导航、浏览器当前网页标题、登录 form 顶部右侧)

| |

globalViceTitle

|

PigX 快速开发框架

|

全局网站标题 / 副标题-网站副标题(登录左侧底部页顶部文字)

| |

globalViceTitleMsg

|

专注、免费、开源、维护、解疑

|

全局网站标题 / 副标题-网站副标题(登录页顶部文字)

| |

globalI18n

|

zh-cn

|

全局网站标题 / 副标题-默认初始语言,可选值"<zh-cn

| |

globalComponentSize

|

'default'

|

全局网站标题 / 副标题-默认全局组件大小,可选值"<large

| |

footerAuthor

|

©2023 pig4cloud.com

|

全局网站标题 / 副标题-footer 页面作者

|

[](#图形化配置)图形化配置

本页导航

图形化配置