ConfigProvider 全局配置

Config Provider 被用来提供全局的配置选项, 让你的配置能够在全局都能够被访问到。

i18n 配置

通过 Config Provider 来配置多语言, 让你的应用可以随时切换语言。

语言包文件存放在 packages/locale/lang 目录下, 默认语言为 en, 当前支持的语言包有en、zhCN、zhTW、ja

TIP

Config Provider 还支持拓展翻译文本对象, 通过配置一个类型为 TranslatePair 的属性 extendsI18nMsg 实现, 具体格式参考语言包文件解构

<template>
  <div class="i18n-container">
    <px-button @click="changeLang" type="success" class="mr-20">{{
      language
    }}</px-button>
    <px-config-provider :locale="locale">
      <px-popconfirm title="Are you shure to delete this item?" trigger="hover">
        <px-button>Delete</px-button>
      </px-popconfirm>
    </px-config-provider>
  </div>
</template>
<script setup lang="ts">
import { ref, computed } from 'vue'
import { en, zhCN, zhTW, ja } from '@mmt817/pixel-ui'
import { get } from 'lodash-es'

// 国际化
const language = ref('en')
const langMap = { en, zhCN, zhTW, ja } as const
const locale = computed(() => get(langMap, language.value))
const changeLang = () => {
  const l = ['en', 'zhCN', 'zhTW', 'ja']
  language.value = l[(l.indexOf(language.value) + 1) % l.length]
}
</script>

实验性功能

在本节中, 您可以学习如何使用 Config Provider 来提供实验性功能。 现在, 我们还没有添加任何实验性功能, 但在未来的规划中, 我们将添加一些实验性功能。 您可以使用此配置来管理这些功能。

API_Table插件测试

DANGER

该插件基于 markdown-it 开发, 解析组件 types.ts 文件生成 API 表格, 测试中

ConfigProvider API

Props

Name	Description	Type	Default
locale	翻译文本对象	object	en
extendsI18nMsg	扩展翻译文本对象	TranslatePair	{}

Slots

Name	Description
default	自定义默认内容,提供全局配置