• ConfigProvider 全局化配置
    • 使用
      • Content Security Policy
    • API

    ConfigProvider 全局化配置

    为组件提供统一的全局化配置。

    使用

    ConfigProvider 使用 Vue 的 provide / inject 特性,只需在应用外围包裹一次即可全局生效。

    1. <template>
    2. <a-config-provider :getPopupContainer="getPopupContainer">
    3. <app />
    4. </a-config-provider>
    5. </template>
    6. <script>
    7. export default {
    8. methods: {
    9. getPopupContainer(el, dialogContext) {
    10. if (dialogContext) {
    11. return dialogContext.getDialogWrap();
    12. } else {
    13. return document.body;
    14. }
    15. },
    16. },
    17. };
    18. </script>

    Content Security Policy

    部分组件为了支持波纹效果,使用了动态样式。如果开启了 Content Security Policy (CSP),你可以通过 csp 属性来进行配置:

    1. <a-config-provider :csp="{ nonce: 'YourNonceCode' }">
    2. <a-button>My Button</a-button>
    3. </a-config-provider>

    API

    参数说明类型默认值
    autoInsertSpaceInButton设置为 false 时,移除按钮中 2 个汉字之间的空格booleantrue
    csp设置 Content Security Policy 配置{ nonce: string }-
    renderEmpty自定义组件空状态。参考 空状态slot-scope | Function(componentName: string): VNode-
    getPopupContainer弹出框(Select, Tooltip, Menu 等等)渲染父节点,默认渲染到 body 上。Function(triggerNode, dialogContext)() => document.body
    prefixCls设置统一样式前缀stringant