witApp 应用根组件
witApp 是一个应用根组件，基于 Element Plus 的 el-config-provider 实现了全局配置管理，包括国际化语言设置和按钮样式配置，并集成了路由视图和 PWA 更新提示功能。该组件作为应用的入口容器，统一管理全局配置和布局结构。
用法实例
vue
<template>
<witApp />
</template>
<script lang="ts" setup>
import witApp from '@/library/components/witApp'
</script>API
组件
| 组件名 | 描述 |
|---|---|
witApp | 应用根组件，提供全局配置和路由容器 |
属性
| 属性名 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| - | - | - | 组件无自定义属性 |
方法
| 方法名 | 描述 | 参数类型 |
|---|---|---|
| - | - | - |
事件
| 事件名 | 描述 | 参数 |
|---|---|---|
| - | - | - |
功能特性
全局配置管理
- 集成 Element Plus 的
el-config-provider，统一管理全局组件配置 - 配置按钮自动插入空格功能，提升中文排版美观度
- 根据当前语言环境自动切换 Element Plus 的本地化设置
路由视图容器
- 作为应用的根路由容器，渲染匹配的路由组件
- 支持 Vue Router 的所有路由配置和功能
国际化支持
- 自动检测当前语言环境（中文/英文）
- 动态切换 Element Plus 的语言包
- 与应用的 i18n 系统无缝集成
PWA 更新提示
- 根据 PWA 配置条件显示更新提示组件
- 支持渐进式 Web 应用的版本更新管理
TIP
- 组件是应用的根组件，通常只需要在主入口文件中使用一次。
- 语言切换功能依赖于应用的 i18n 系统，需要确保正确配置了中英文语言包。
- PWA 更新提示功能需要在
/@/config中启用pwa配置。 - 组件会自动将按钮的
autoInsertSpace设置为true，提升中文环境下的按钮文本可读性。 - 作为根组件，它会包裹所有页面内容，确保全局配置的一致性。