1. Ant Design Vue global configuration items
Ant Design Vue official website: https://www.antdv.com/components/overview-cn
The global configuration of antdv is generally used for
| parameter | illustrate | type | Defaults | Version |
|---|---|---|---|---|
| autoInsertSpaceInButton | false When set to , remove the space between 2 Chinese characters in the button |
boolean | true | |
| componentSize | Set antd component size | small | middle | large |
- | 3.0 |
| csp | Set Content Security Policy configuration | { nonce: string } | - | |
| direction | Set the text display direction. example | ltr | rtl |
ltr |
3.0 |
| dropdownMatchSelectWidth | The dropdown menu is as wide as the selector. Will be set by default min-width, and will be ignored when the value is smaller than the width of the select box. false virtual scrolling is turned off when |
boolean | number | - | |
| form | Set common properties of the Form component | { validateMessages?: ValidateMessages, requiredMark?: boolean | optional, colon?: boolean} |
- | 3.0 |
| getPopupContainer | Pop-up boxes (Select, Tooltip, Menu, etc.) render parent nodes, which are rendered on the body by default. | Function(triggerNode, dialogContext) | () => document.body | |
| getTargetContainer | Configure Affix, Anchor scrolling monitoring container. | () => HTMLElement | () => window | 3.0 |
| input | Set the general properties of the Input component | { autocomplete?: string } | - | 3.0 |
| locale | Language pack configuration, the language pack can be found in the ant-design-vue/es/locale directory | object | - | 1.5.0 |
| pageHeader | Set the ghost of pageHeader uniformly, refer to pageHeader | { ghost: boolean } | 'true' | 1.5.0 |
| prefixCls | Set the uniform style prefix. Note: need to be used with less variables @ant-prefix |
string | ant |
|
| renderEmpty | Custom component empty state. reference empty state | slot | Function(componentName: string): VNode | - | |
| space | To set Space size, refer to Space |
{ size: small | middle | large | number } |
- | 3.0 |
| transformCellText | Table data can be changed again before rendering, the default configuration of general user empty data | Function({ text, column, record, index }) => any | - | 1.5.4 |
| virtual | false Turn off virtual scrolling when set |
boolean | - | 3.0 |
2. The Vue3 project uses the Ant Design Vue global configuration item
The sample code is as follows:
<template>
<a-config-provider :locale="locale">
<router-view/>
</a-config-provider>
</template>
<script setup>
import {ref} from 'vue'
import { ConfigProvider as AConfigProvider} from 'ant-design-vue';
//语言包
import zhCN from 'ant-design-vue/es/locale/zh_CN';
const locale=ref(zhCN);
</script>
<style lang="less">
</style>2. Change and assign a value to the top title of the website
As shown in the picture: 
Here is the title of the website. If you need to change the title of the website, you can use
document.title="标题内容"3. Change the website icon
document.querySelector('link[rel="icon"]').href=""