import{y as I,d as y,r as h,I as b,s as H,J as L,_ as r,M as f,j as e,k as g,l as A,w as p,b as n,f as s,e as a,a as x,n as w}from"./index.c1b9962e.js";I.locale("en");const D=[{title:"Name",dataIndex:"name",filters:[{text:"filter1",value:"filter1"}]},{title:"Age",dataIndex:"age"}],R=y({setup(){const o=h(!1),t=h(b.locale);return H(t,l=>{I.locale(l)}),{columns:D,visible:o,locale:t,moment:I,enUS:b,zhCN:L,info:()=>{f.info({title:"some info",content:"some info"})},confirm:()=>{f.confirm({title:"some info",content:"some info"})}}}}),_={class:"change-locale"},T={class:"locale-components"},J={class:"example"},K={class:"example"},F={class:"example"},q={class:"example"},U={class:"site-config-provider-calendar-wrapper"},M={class:"example"};function Q(o,t,u,i,l,d){const k=e("a-radio-button"),m=e("a-radio-group"),Z=e("a-pagination"),v=e("a-select-option"),W=e("a-select"),P=e("a-date-picker"),G=e("a-time-picker"),Y=e("a-range-picker"),C=e("a-button"),S=e("a-popconfirm"),N=e("a-transfer"),X=e("a-calendar"),B=e("a-table"),j=e("a-modal"),V=e("a-config-provider"),z=e("demo-box");return g(),A(z,{jsfiddle:{us:"Components which need localization support are listed here, you can toggle the language in the demo.",cn:"\u6B64\u5904\u5217\u51FA Ant Design Vue \u4E2D\u9700\u8981\u56FD\u9645\u5316\u652F\u6301\u7684\u7EC4\u4EF6\uFF0C\u4F60\u53EF\u4EE5\u5728\u6F14\u793A\u91CC\u5207\u6362\u8BED\u8A00\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
<p>\u6B64\u5904\u5217\u51FA Ant Design Vue \u4E2D\u9700\u8981\u56FD\u9645\u5316\u652F\u6301\u7684\u7EC4\u4EF6\uFF0C\u4F60\u53EF\u4EE5\u5728\u6F14\u793A\u91CC\u5207\u6362\u8BED\u8A00\u3002</p>
<h2 id="en-us">en-US</h2>
<p>Components which need localization support are listed here, you can toggle the language in the demo.</p>
`,order:1,title:{"zh-CN":"\u56FD\u9645\u5316","en-US":"Locale"},relativePath:"src/docs/config-provider/demo/locale.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXYgY2xhc3M9ImNoYW5nZS1sb2NhbGUiPgogICAgPHNwYW4gc3R5bGU9Im1hcmdpbi1yaWdodDogMTZweCI+Q2hhbmdlIGxvY2FsZSBvZiBjb21wb25lbnRzOjwvc3Bhbj4KICAgIDxhLXJhZGlvLWdyb3VwIHYtbW9kZWw6dmFsdWU9ImxvY2FsZSI+CiAgICAgIDxhLXJhZGlvLWJ1dHRvbiBrZXk9ImVuIiA6dmFsdWU9ImVuVVMubG9jYWxlIj5FbmdsaXNoPC9hLXJhZGlvLWJ1dHRvbj4KICAgICAgPGEtcmFkaW8tYnV0dG9uIGtleT0iY24iIDp2YWx1ZT0iemhDTi5sb2NhbGUiPuS4reaWhzwvYS1yYWRpby1idXR0b24+CiAgICA8L2EtcmFkaW8tZ3JvdXA+CiAgPC9kaXY+CiAgPGEtY29uZmlnLXByb3ZpZGVyIDpsb2NhbGU9ImxvY2FsZSA9PT0gJ2VuJyA/IGVuVVMgOiB6aENOIj4KICAgIDxkaXYgY2xhc3M9ImxvY2FsZS1jb21wb25lbnRzIj4KICAgICAgPGRpdiBjbGFzcz0iZXhhbXBsZSI+CiAgICAgICAgPGEtcGFnaW5hdGlvbiA6dG90YWw9IjUwIiBzaG93LXNpemUtY2hhbmdlciAvPgogICAgICA8L2Rpdj4KICAgICAgPGRpdiBjbGFzcz0iZXhhbXBsZSI+CiAgICAgICAgPGEtc2VsZWN0IHNob3ctc2VhcmNoIHN0eWxlPSJ3aWR0aDogMjAwcHgiPgogICAgICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0iamFjayI+amFjazwvYS1zZWxlY3Qtb3B0aW9uPgogICAgICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0ibHVjeSI+bHVjeTwvYS1zZWxlY3Qtb3B0aW9uPgogICAgICAgIDwvYS1zZWxlY3Q+CiAgICAgICAgPGEtZGF0ZS1waWNrZXIgLz4KICAgICAgICA8YS10aW1lLXBpY2tlciAvPgogICAgICAgIDxhLXJhbmdlLXBpY2tlciBzdHlsZT0id2lkdGg6IDIwMHB4IiAvPgogICAgICA8L2Rpdj4KICAgICAgPGRpdiBjbGFzcz0iZXhhbXBsZSI+CiAgICAgICAgPGEtYnV0dG9uIHR5cGU9InByaW1hcnkiIEBjbGljaz0idmlzaWJsZSA9IHRydWUiPlNob3cgTW9kYWw8L2EtYnV0dG9uPgogICAgICAgIDxhLWJ1dHRvbiBAY2xpY2s9ImluZm8iPlNob3cgaW5mbzwvYS1idXR0b24+CiAgICAgICAgPGEtYnV0dG9uIEBjbGljaz0iY29uZmlybSI+U2hvdyBjb25maXJtPC9hLWJ1dHRvbj4KICAgICAgICA8YS1wb3Bjb25maXJtIHRpdGxlPSJRdWVzdGlvbj8iPgogICAgICAgICAgPGEgaHJlZj0iIyI+Q2xpY2sgdG8gY29uZmlybTwvYT4KICAgICAgICA8L2EtcG9wY29uZmlybT4KICAgICAgPC9kaXY+CiAgICAgIDxkaXYgY2xhc3M9ImV4YW1wbGUiPgogICAgICAgIDxhLXRyYW5zZmVyIDpkYXRhLXNvdXJjZT0iW10iIHNob3ctc2VhcmNoIDp0YXJnZXQta2V5cz0iW10iIDpyZW5kZXI9Iml0ZW0gPT4gaXRlbS50aXRsZSIgLz4KICAgICAgPC9kaXY+CiAgICAgIDxkaXYgY2xhc3M9InNpdGUtY29uZmlnLXByb3ZpZGVyLWNhbGVuZGFyLXdyYXBwZXIiPgogICAgICAgIDxhLWNhbGVuZGFyIDpmdWxsc2NyZWVuPSJmYWxzZSIgOnZhbHVlPSJtb21lbnQoKSIgLz4KICAgICAgPC9kaXY+CiAgICAgIDxkaXYgY2xhc3M9ImV4YW1wbGUiPgogICAgICAgIDxhLXRhYmxlIDpkYXRhLXNvdXJjZT0iW10iIDpjb2x1bW5zPSJjb2x1bW5zIiAvPgogICAgICA8L2Rpdj4KICAgICAgPGEtbW9kYWwgdi1tb2RlbDp2aXNpYmxlPSJ2aXNpYmxlIiB0aXRsZT0iTG9jYWxlIE1vZGFsIj4KICAgICAgICA8cD5Mb2NhbGUgTW9kYWw8L3A+CiAgICAgIDwvYS1tb2RhbD4KICAgIDwvZGl2PgogIDwvYS1jb25maWctcHJvdmlkZXI+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IE1vZGFsIH0gZnJvbSAnYW50LWRlc2lnbi12dWUnOwppbXBvcnQgZW5VUyBmcm9tICdhbnQtZGVzaWduLXZ1ZS9lcy9sb2NhbGUvZW5fVVMnOwppbXBvcnQgemhDTiBmcm9tICdhbnQtZGVzaWduLXZ1ZS9lcy9sb2NhbGUvemhfQ04nOwppbXBvcnQgbW9tZW50IGZyb20gJ21vbWVudCc7CmltcG9ydCAnbW9tZW50L2Rpc3QvbG9jYWxlL3poLWNuJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYsIHdhdGNoIH0gZnJvbSAndnVlJzsKCm1vbWVudC5sb2NhbGUoJ2VuJyk7Cgpjb25zdCBjb2x1bW5zID0gWwogIHsKICAgIHRpdGxlOiAnTmFtZScsCiAgICBkYXRhSW5kZXg6ICduYW1lJywKICAgIGZpbHRlcnM6IFsKICAgICAgewogICAgICAgIHRleHQ6ICdmaWx0ZXIxJywKICAgICAgICB2YWx1ZTogJ2ZpbHRlcjEnLAogICAgICB9LAogICAgXSwKICB9LAogIHsKICAgIHRpdGxlOiAnQWdlJywKICAgIGRhdGFJbmRleDogJ2FnZScsCiAgfSwKXTsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHZpc2libGUgPSByZWYoZmFsc2UpOwogICAgY29uc3QgbG9jYWxlID0gcmVmKGVuVVMubG9jYWxlKTsKICAgIHdhdGNoKGxvY2FsZSwgdmFsID0+IHsKICAgICAgbW9tZW50LmxvY2FsZSh2YWwpOwogICAgfSk7CiAgICBjb25zdCBpbmZvID0gKCkgPT4gewogICAgICBNb2RhbC5pbmZvKHsKICAgICAgICB0aXRsZTogJ3NvbWUgaW5mbycsCiAgICAgICAgY29udGVudDogJ3NvbWUgaW5mbycsCiAgICAgIH0pOwogICAgfTsKICAgIGNvbnN0IGNvbmZpcm0gPSAoKSA9PiB7CiAgICAgIE1vZGFsLmNvbmZpcm0oewogICAgICAgIHRpdGxlOiAnc29tZSBpbmZvJywKICAgICAgICBjb250ZW50OiAnc29tZSBpbmZvJywKICAgICAgfSk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgY29sdW1ucywKICAgICAgdmlzaWJsZSwKICAgICAgbG9jYWxlLAogICAgICBtb21lbnQsCiAgICAgIGVuVVMsCiAgICAgIHpoQ04sCiAgICAgIGluZm8sCiAgICAgIGNvbmZpcm0sCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KPHN0eWxlIHNjb3BlZD4KLnNpdGUtY29uZmlnLXByb3ZpZGVyLWNhbGVuZGFyLXdyYXBwZXIgewogIHdpZHRoOiAzMTlweDsKICBib3JkZXI6IDFweCBzb2xpZCAjZDlkOWQ5OwogIGJvcmRlci1yYWRpdXM6IDJweDsKfQoubG9jYWxlLWNvbXBvbmVudHMgewogIGJvcmRlci10b3A6IDFweCBzb2xpZCAjZDlkOWQ5OwogIHBhZGRpbmctdG9wOiAxNnB4Owp9CgouZXhhbXBsZSB7CiAgbWFyZ2luOiAxNnB4IDA7Cn0KCi5leGFtcGxlID4gKiB7CiAgbWFyZ2luLXJpZ2h0OiA4cHg7Cn0KCi5jaGFuZ2UtbG9jYWxlIHsKICBtYXJnaW4tYm90dG9tOiAxNnB4Owp9CltkYXRhLXRoZW1lPSdkYXJrJ10gLmxvY2FsZS1jb21wb25lbnRzIHsKICBib3JkZXItdG9wOiAxcHggc29saWQgIzMwMzAzMDsKfQpbZGF0YS10aGVtZT0nZGFyayddIC5zaXRlLWNvbmZpZy1wcm92aWRlci1jYWxlbmRhci13cmFwcGVyIHsKICBib3JkZXI6IDFweCBzb2xpZCAjMzAzMDMwOwp9Cjwvc3R5bGU+Cg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXYgY2xhc3M9ImNoYW5nZS1sb2NhbGUiPgogICAgPHNwYW4gc3R5bGU9Im1hcmdpbi1yaWdodDogMTZweCI+Q2hhbmdlIGxvY2FsZSBvZiBjb21wb25lbnRzOjwvc3Bhbj4KICAgIDxhLXJhZGlvLWdyb3VwIHYtbW9kZWw6dmFsdWU9ImxvY2FsZSI+CiAgICAgIDxhLXJhZGlvLWJ1dHRvbiBrZXk9ImVuIiA6dmFsdWU9ImVuVVMubG9jYWxlIj5FbmdsaXNoPC9hLXJhZGlvLWJ1dHRvbj4KICAgICAgPGEtcmFkaW8tYnV0dG9uIGtleT0iY24iIDp2YWx1ZT0iemhDTi5sb2NhbGUiPuS4reaWhzwvYS1yYWRpby1idXR0b24+CiAgICA8L2EtcmFkaW8tZ3JvdXA+CiAgPC9kaXY+CiAgPGEtY29uZmlnLXByb3ZpZGVyIDpsb2NhbGU9ImxvY2FsZSA9PT0gJ2VuJyA/IGVuVVMgOiB6aENOIj4KICAgIDxkaXYgY2xhc3M9ImxvY2FsZS1jb21wb25lbnRzIj4KICAgICAgPGRpdiBjbGFzcz0iZXhhbXBsZSI+CiAgICAgICAgPGEtcGFnaW5hdGlvbiA6dG90YWw9IjUwIiBzaG93LXNpemUtY2hhbmdlciAvPgogICAgICA8L2Rpdj4KICAgICAgPGRpdiBjbGFzcz0iZXhhbXBsZSI+CiAgICAgICAgPGEtc2VsZWN0IHNob3ctc2VhcmNoIHN0eWxlPSJ3aWR0aDogMjAwcHgiPgogICAgICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0iamFjayI+amFjazwvYS1zZWxlY3Qtb3B0aW9uPgogICAgICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0ibHVjeSI+bHVjeTwvYS1zZWxlY3Qtb3B0aW9uPgogICAgICAgIDwvYS1zZWxlY3Q+CiAgICAgICAgPGEtZGF0ZS1waWNrZXIgLz4KICAgICAgICA8YS10aW1lLXBpY2tlciAvPgogICAgICAgIDxhLXJhbmdlLXBpY2tlciBzdHlsZT0id2lkdGg6IDIwMHB4IiAvPgogICAgICA8L2Rpdj4KICAgICAgPGRpdiBjbGFzcz0iZXhhbXBsZSI+CiAgICAgICAgPGEtYnV0dG9uIHR5cGU9InByaW1hcnkiIEBjbGljaz0idmlzaWJsZSA9IHRydWUiPlNob3cgTW9kYWw8L2EtYnV0dG9uPgogICAgICAgIDxhLWJ1dHRvbiBAY2xpY2s9ImluZm8iPlNob3cgaW5mbzwvYS1idXR0b24+CiAgICAgICAgPGEtYnV0dG9uIEBjbGljaz0iY29uZmlybSI+U2hvdyBjb25maXJtPC9hLWJ1dHRvbj4KICAgICAgICA8YS1wb3Bjb25maXJtIHRpdGxlPSJRdWVzdGlvbj8iPgogICAgICAgICAgPGEgaHJlZj0iIyI+Q2xpY2sgdG8gY29uZmlybTwvYT4KICAgICAgICA8L2EtcG9wY29uZmlybT4KICAgICAgPC9kaXY+CiAgICAgIDxkaXYgY2xhc3M9ImV4YW1wbGUiPgogICAgICAgIDxhLXRyYW5zZmVyIDpkYXRhLXNvdXJjZT0iW10iIHNob3ctc2VhcmNoIDp0YXJnZXQta2V5cz0iW10iIDpyZW5kZXI9Iml0ZW0gPT4gaXRlbS50aXRsZSIgLz4KICAgICAgPC9kaXY+CiAgICAgIDxkaXYgY2xhc3M9InNpdGUtY29uZmlnLXByb3ZpZGVyLWNhbGVuZGFyLXdyYXBwZXIiPgogICAgICAgIDxhLWNhbGVuZGFyIDpmdWxsc2NyZWVuPSJmYWxzZSIgOnZhbHVlPSJtb21lbnQoKSIgLz4KICAgICAgPC9kaXY+CiAgICAgIDxkaXYgY2xhc3M9ImV4YW1wbGUiPgogICAgICAgIDxhLXRhYmxlIDpkYXRhLXNvdXJjZT0iW10iIDpjb2x1bW5zPSJjb2x1bW5zIiAvPgogICAgICA8L2Rpdj4KICAgICAgPGEtbW9kYWwgdi1tb2RlbDp2aXNpYmxlPSJ2aXNpYmxlIiB0aXRsZT0iTG9jYWxlIE1vZGFsIj4KICAgICAgICA8cD5Mb2NhbGUgTW9kYWw8L3A+CiAgICAgIDwvYS1tb2RhbD4KICAgIDwvZGl2PgogIDwvYS1jb25maWctcHJvdmlkZXI+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IE1vZGFsIH0gZnJvbSAnYW50LWRlc2lnbi12dWUnOwppbXBvcnQgZW5VUyBmcm9tICdhbnQtZGVzaWduLXZ1ZS9lcy9sb2NhbGUvZW5fVVMnOwppbXBvcnQgemhDTiBmcm9tICdhbnQtZGVzaWduLXZ1ZS9lcy9sb2NhbGUvemhfQ04nOwppbXBvcnQgbW9tZW50IGZyb20gJ21vbWVudCc7CmltcG9ydCAnbW9tZW50L2Rpc3QvbG9jYWxlL3poLWNuJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYsIHdhdGNoIH0gZnJvbSAndnVlJzsKbW9tZW50LmxvY2FsZSgnZW4nKTsKY29uc3QgY29sdW1ucyA9IFsKICB7CiAgICB0aXRsZTogJ05hbWUnLAogICAgZGF0YUluZGV4OiAnbmFtZScsCiAgICBmaWx0ZXJzOiBbCiAgICAgIHsKICAgICAgICB0ZXh0OiAnZmlsdGVyMScsCiAgICAgICAgdmFsdWU6ICdmaWx0ZXIxJywKICAgICAgfSwKICAgIF0sCiAgfSwKICB7CiAgICB0aXRsZTogJ0FnZScsCiAgICBkYXRhSW5kZXg6ICdhZ2UnLAogIH0sCl07CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2aXNpYmxlID0gcmVmKGZhbHNlKTsKICAgIGNvbnN0IGxvY2FsZSA9IHJlZihlblVTLmxvY2FsZSk7CiAgICB3YXRjaChsb2NhbGUsIHZhbCA9PiB7CiAgICAgIG1vbWVudC5sb2NhbGUodmFsKTsKICAgIH0pOwogICAgY29uc3QgaW5mbyA9ICgpID0+IHsKICAgICAgTW9kYWwuaW5mbyh7CiAgICAgICAgdGl0bGU6ICdzb21lIGluZm8nLAogICAgICAgIGNvbnRlbnQ6ICdzb21lIGluZm8nLAogICAgICB9KTsKICAgIH07CiAgICBjb25zdCBjb25maXJtID0gKCkgPT4gewogICAgICBNb2RhbC5jb25maXJtKHsKICAgICAgICB0aXRsZTogJ3NvbWUgaW5mbycsCiAgICAgICAgY29udGVudDogJ3NvbWUgaW5mbycsCiAgICAgIH0pOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIGNvbHVtbnMsCiAgICAgIHZpc2libGUsCiAgICAgIGxvY2FsZSwKICAgICAgbW9tZW50LAogICAgICBlblVTLAogICAgICB6aENOLAogICAgICBpbmZvLAogICAgICBjb25maXJtLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZSBzY29wZWQ+Ci5zaXRlLWNvbmZpZy1wcm92aWRlci1jYWxlbmRhci13cmFwcGVyIHsKICB3aWR0aDogMzE5cHg7CiAgYm9yZGVyOiAxcHggc29saWQgI2Q5ZDlkOTsKICBib3JkZXItcmFkaXVzOiAycHg7Cn0KLmxvY2FsZS1jb21wb25lbnRzIHsKICBib3JkZXItdG9wOiAxcHggc29saWQgI2Q5ZDlkOTsKICBwYWRkaW5nLXRvcDogMTZweDsKfQoKLmV4YW1wbGUgewogIG1hcmdpbjogMTZweCAwOwp9CgouZXhhbXBsZSA+ICogewogIG1hcmdpbi1yaWdodDogOHB4Owp9CgouY2hhbmdlLWxvY2FsZSB7CiAgbWFyZ2luLWJvdHRvbTogMTZweDsKfQpbZGF0YS10aGVtZT0nZGFyayddIC5sb2NhbGUtY29tcG9uZW50cyB7CiAgYm9yZGVyLXRvcDogMXB4IHNvbGlkICMzMDMwMzA7Cn0KW2RhdGEtdGhlbWU9J2RhcmsnXSAuc2l0ZS1jb25maWctcHJvdmlkZXItY2FsZW5kYXItd3JhcHBlciB7CiAgYm9yZGVyOiAxcHggc29saWQgIzMwMzAzMDsKfQo8L3N0eWxlPg=="}},{default:p(()=>[n("div",_,[t[5]||(t[5]=n("span",{style:{"margin-right":"16px"}},"Change locale of components:",-1)),s(m,{value:o.locale,"onUpdate:value":t[0]||(t[0]=c=>o.locale=c)},{default:p(()=>[s(k,{key:"en",value:o.enUS.locale},{default:p(()=>t[3]||(t[3]=[a("English")])),_:1,__:[3]},8,["value"]),s(k,{key:"cn",value:o.zhCN.locale},{default:p(()=>t[4]||(t[4]=[a("\u4E2D\u6587")])),_:1,__:[4]},8,["value"])]),_:1},8,["value"])]),s(V,{locale:o.locale==="en"?o.enUS:o.zhCN},{default:p(()=>[n("div",T,[n("div",J,[s(Z,{total:50,"show-size-changer":""})]),n("div",K,[s(W,{"show-search":"",style:{width:"200px"}},{default:p(()=>[s(v,{value:"jack"},{default:p(()=>t[6]||(t[6]=[a("jack")])),_:1,__:[6]}),s(v,{value:"lucy"},{default:p(()=>t[7]||(t[7]=[a("lucy")])),_:1,__:[7]})]),_:1}),s(P),s(G),s(Y,{style:{width:"200px"}})]),n("div",F,[s(C,{type:"primary",onClick:t[1]||(t[1]=c=>o.visible=!0)},{default:p(()=>t[8]||(t[8]=[a("Show Modal")])),_:1,__:[8]}),s(C,{onClick:o.info},{default:p(()=>t[9]||(t[9]=[a("Show info")])),_:1,__:[9]},8,["onClick"]),s(C,{onClick:o.confirm},{default:p(()=>t[10]||(t[10]=[a("Show confirm")])),_:1,__:[10]},8,["onClick"]),s(S,{title:"Question?"},{default:p(()=>t[11]||(t[11]=[n("a",{href:"#"},"Click to confirm",-1)])),_:1,__:[11]})]),n("div",q,[s(N,{"data-source":[],"show-search":"","target-keys":[],render:c=>c.title},null,8,["render"])]),n("div",U,[s(X,{fullscreen:!1,value:o.moment()},null,8,["value"])]),n("div",M,[s(B,{"data-source":[],columns:o.columns},null,8,["columns"])]),s(j,{visible:o.visible,"onUpdate:visible":t[2]||(t[2]=c=>o.visible=c),title:"Locale Modal"},{default:p(()=>t[12]||(t[12]=[n("p",null,"Locale Modal",-1)])),_:1,__:[12]},8,["visible"])])]),_:1},8,["locale"])]),htmlCode:p(()=>t[13]||(t[13]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("change-locale"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("span")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-right"),n("span",{class:"token punctuation"},":"),a(" 16px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a("Change locale of components:"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("span")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("locale"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("en"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("enUS.locale"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("English"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("cn"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("zhCN.locale"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("\u4E2D\u6587"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-group")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-config-provider")]),a(),n("span",{class:"token attr-name"},":locale"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("locale === 'en' ? enUS : zhCN"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("locale-components"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-pagination")]),a(),n("span",{class:"token attr-name"},":total"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("50"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"show-size-changer"),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-select")]),a(),n("span",{class:"token attr-name"},"show-search"),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 200px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-select-option")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("jack"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("jack"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-select-option")]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-select-option")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("lucy"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("lucy"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-select-option")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-select")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-date-picker")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-time-picker")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-range-picker")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 200px")]),n("span",{class:"token punctuation"},'"')])]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("primary"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("visible = true"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Show Modal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("info"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Show info"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("confirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Show confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-popconfirm")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Question?"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a")]),a(),n("span",{class:"token attr-name"},"href"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Click to confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-popconfirm")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-transfer")]),a(),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("[]"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"show-search"),a(),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("[]"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("item => item.title"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("site-config-provider-calendar-wrapper"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-calendar")]),a(),n("span",{class:"token attr-name"},":fullscreen"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("false"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("moment()"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-table")]),a(),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("[]"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":columns"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("columns"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-modal")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("visible"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Locale Modal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Locale Modal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-modal")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-config-provider")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" Modal "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(" enUS "),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'ant-design-vue/es/locale/en_US'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(" zhCN "),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'ant-design-vue/es/locale/zh_CN'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(" moment "),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'moment'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token string"},"'moment/dist/locale/zh-cn'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref"),n("span",{class:"token punctuation"},","),a(" watch "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

moment`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"locale"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'en'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"const"),a(" columns "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),a(`
  `),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Name'"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token literal-property property"},"dataIndex"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'name'"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token literal-property property"},"filters"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),a(`
      `),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"text"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'filter1'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'filter1'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Age'"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token literal-property property"},"dataIndex"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'age'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" visible "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" locale "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),a("enUS"),n("span",{class:"token punctuation"},"."),a("locale"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),a("locale"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token parameter"},"val"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      moment`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"locale"),n("span",{class:"token punctuation"},"("),a("val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"info"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"info"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'some info'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'some info'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"confirm"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'some info'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'some info'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      columns`),n("span",{class:"token punctuation"},","),a(`
      visible`),n("span",{class:"token punctuation"},","),a(`
      locale`),n("span",{class:"token punctuation"},","),a(`
      moment`),n("span",{class:"token punctuation"},","),a(`
      enUS`),n("span",{class:"token punctuation"},","),a(`
      zhCN`),n("span",{class:"token punctuation"},","),a(`
      info`),n("span",{class:"token punctuation"},","),a(`
      confirm`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".site-config-provider-calendar-wrapper"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 319px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border"),n("span",{class:"token punctuation"},":"),a(" 1px solid #d9d9d9"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border-radius"),n("span",{class:"token punctuation"},":"),a(" 2px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},".locale-components"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"border-top"),n("span",{class:"token punctuation"},":"),a(" 1px solid #d9d9d9"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"padding-top"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".example"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),a(" 16px 0"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".example > *"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-right"),n("span",{class:"token punctuation"},":"),a(" 8px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".change-locale"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] .locale-components"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"border-top"),n("span",{class:"token punctuation"},":"),a(" 1px solid #303030"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] .site-config-provider-calendar-wrapper"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"border"),n("span",{class:"token punctuation"},":"),a(" 1px solid #303030"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:p(()=>t[14]||(t[14]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("change-locale"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("span")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-right"),n("span",{class:"token punctuation"},":"),a(" 16px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a("Change locale of components:"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("span")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("locale"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("en"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("enUS.locale"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("English"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("cn"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("zhCN.locale"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("\u4E2D\u6587"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-group")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-config-provider")]),a(),n("span",{class:"token attr-name"},":locale"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("locale === 'en' ? enUS : zhCN"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("locale-components"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-pagination")]),a(),n("span",{class:"token attr-name"},":total"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("50"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"show-size-changer"),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-select")]),a(),n("span",{class:"token attr-name"},"show-search"),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 200px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-select-option")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("jack"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("jack"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-select-option")]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-select-option")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("lucy"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("lucy"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-select-option")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-select")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-date-picker")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-time-picker")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-range-picker")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 200px")]),n("span",{class:"token punctuation"},'"')])]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("primary"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("visible = true"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Show Modal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("info"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Show info"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("confirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Show confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-popconfirm")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Question?"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a")]),a(),n("span",{class:"token attr-name"},"href"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Click to confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-popconfirm")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-transfer")]),a(),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("[]"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"show-search"),a(),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("[]"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("item => item.title"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("site-config-provider-calendar-wrapper"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-calendar")]),a(),n("span",{class:"token attr-name"},":fullscreen"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("false"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("moment()"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-table")]),a(),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("[]"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":columns"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("columns"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-modal")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("visible"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Locale Modal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Locale Modal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-modal")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-config-provider")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" Modal "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(" enUS "),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'ant-design-vue/es/locale/en_US'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(" zhCN "),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'ant-design-vue/es/locale/zh_CN'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(" moment "),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'moment'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token string"},"'moment/dist/locale/zh-cn'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref"),n("span",{class:"token punctuation"},","),a(" watch "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
moment`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"locale"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'en'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"const"),a(" columns "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),a(`
  `),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Name'"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token literal-property property"},"dataIndex"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'name'"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token literal-property property"},"filters"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),a(`
      `),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"text"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'filter1'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'filter1'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Age'"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token literal-property property"},"dataIndex"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'age'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" visible "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" locale "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),a("enUS"),n("span",{class:"token punctuation"},"."),a("locale"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),a("locale"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token parameter"},"val"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      moment`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"locale"),n("span",{class:"token punctuation"},"("),a("val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"info"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"info"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'some info'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'some info'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"confirm"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'some info'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'some info'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      columns`),n("span",{class:"token punctuation"},","),a(`
      visible`),n("span",{class:"token punctuation"},","),a(`
      locale`),n("span",{class:"token punctuation"},","),a(`
      moment`),n("span",{class:"token punctuation"},","),a(`
      enUS`),n("span",{class:"token punctuation"},","),a(`
      zhCN`),n("span",{class:"token punctuation"},","),a(`
      info`),n("span",{class:"token punctuation"},","),a(`
      confirm`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".site-config-provider-calendar-wrapper"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 319px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border"),n("span",{class:"token punctuation"},":"),a(" 1px solid #d9d9d9"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border-radius"),n("span",{class:"token punctuation"},":"),a(" 2px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},".locale-components"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"border-top"),n("span",{class:"token punctuation"},":"),a(" 1px solid #d9d9d9"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"padding-top"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".example"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),a(" 16px 0"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".example > *"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-right"),n("span",{class:"token punctuation"},":"),a(" 8px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".change-locale"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] .locale-components"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"border-top"),n("span",{class:"token punctuation"},":"),a(" 1px solid #303030"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] .site-config-provider-calendar-wrapper"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"border"),n("span",{class:"token punctuation"},":"),a(" 1px solid #303030"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}var E=r(R,[["render",Q],["__scopeId","data-v-0099adeb"]]);const O={pageData:{title:"ConfigProvider",description:"",frontmatter:{category:"Components",subtitle:"\u5168\u5C40\u5316\u914D\u7F6E",cols:1,type:"\u5176\u4ED6",title:"ConfigProvider",cover:"https://gw.alipayobjects.com/zos/alicdn/kegYxl1wj/ConfigProvider.svg"},headers:[{level:2,title:"\u4F7F\u7528",slug:"\u4F7F\u7528",content:"ConfigProvider \u4F7F\u7528 Vue \u7684 [provide / inject](https://vuejs.org/v2/api/#provide-inject) \u7279\u6027\uFF0C\u53EA\u9700\u5728\u5E94\u7528\u5916\u56F4\u5305\u88F9\u4E00\u6B21\u5373\u53EF\u5168\u5C40\u751F\u6548\u3002"},{level:3,title:"Content Security Policy",slug:"content-security-policy",content:"\u90E8\u5206\u7EC4\u4EF6\u4E3A\u4E86\u652F\u6301\u6CE2\u7EB9\u6548\u679C\uFF0C\u4F7F\u7528\u4E86\u52A8\u6001\u6837\u5F0F\u3002\u5982\u679C\u5F00\u542F\u4E86 Content Security Policy (CSP)\uFF0C\u4F60\u53EF\u4EE5\u901A\u8FC7 `csp` \u5C5E\u6027\u6765\u8FDB\u884C\u914D\u7F6E\uFF1A"},{level:2,title:"API",slug:"api",content:""},{level:2,title:"FAQ",slug:"faq",content:"\u4E3A\u4EC0\u4E48\u6211\u4F7F\u7528\u4E86 ConfigProvider `locale`\uFF0C\u65F6\u95F4\u7C7B\u7EC4\u4EF6\u7684\u56FD\u9645\u5316\u8FD8\u6709\u95EE\u9898\uFF1F"}],relativePath:"src/docs/config-provider/index.zh-CN.md",content:`
\u4E3A\u7EC4\u4EF6\u63D0\u4F9B\u7EDF\u4E00\u7684\u5168\u5C40\u5316\u914D\u7F6E\u3002

## \u4F7F\u7528

ConfigProvider \u4F7F\u7528 Vue \u7684 [provide / inject](https://vuejs.org/v2/api/#provide-inject) \u7279\u6027\uFF0C\u53EA\u9700\u5728\u5E94\u7528\u5916\u56F4\u5305\u88F9\u4E00\u6B21\u5373\u53EF\u5168\u5C40\u751F\u6548\u3002

\`\`\`html
&lt;template&gt;
  &lt;a-config-provider :getPopupContainer=&quot;getPopupContainer&quot;&gt;
    &lt;app /&gt;
  &lt;/a-config-provider&gt;
&lt;/template&gt;
&lt;script&gt;
  export default {
    methods: {
      getPopupContainer(el, dialogContext) {
        if (dialogContext) {
          return dialogContext.getDialogWrap();
        } else {
          return document.body;
        }
      },
    },
  };
&lt;/script&gt;
\`\`\`

### Content Security Policy

\u90E8\u5206\u7EC4\u4EF6\u4E3A\u4E86\u652F\u6301\u6CE2\u7EB9\u6548\u679C\uFF0C\u4F7F\u7528\u4E86\u52A8\u6001\u6837\u5F0F\u3002\u5982\u679C\u5F00\u542F\u4E86 Content Security Policy (CSP)\uFF0C\u4F60\u53EF\u4EE5\u901A\u8FC7 \`csp\` \u5C5E\u6027\u6765\u8FDB\u884C\u914D\u7F6E\uFF1A

\`\`\`html
&lt;a-config-provider :csp=&quot;{ nonce: &#39;YourNonceCode&#39; }&quot;&gt;
  &lt;a-button&gt;My Button&lt;/a-button&gt;
&lt;/a-config-provider&gt;
\`\`\`

## API

| \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |
| --- | --- | --- | --- | --- |
| autoInsertSpaceInButton | \u8BBE\u7F6E\u4E3A \`false\` \u65F6\uFF0C\u79FB\u9664\u6309\u94AE\u4E2D 2 \u4E2A\u6C49\u5B57\u4E4B\u95F4\u7684\u7A7A\u683C | boolean | true |  |
| csp | \u8BBE\u7F6E [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) \u914D\u7F6E | { nonce: string } | - |  |
| renderEmpty | \u81EA\u5B9A\u4E49\u7EC4\u4EF6\u7A7A\u72B6\u6001\u3002\u53C2\u8003 [\u7A7A\u72B6\u6001](/components/empty/) | slot-scope \\| Function(componentName: string): VNode | - |  |
| getPopupContainer | \u5F39\u51FA\u6846\uFF08Select, Tooltip, Menu \u7B49\u7B49\uFF09\u6E32\u67D3\u7236\u8282\u70B9\uFF0C\u9ED8\u8BA4\u6E32\u67D3\u5230 body \u4E0A\u3002 | Function(triggerNode, dialogContext) | () =&gt; document.body |  |
| locale | \u8BED\u8A00\u5305\u914D\u7F6E\uFF0C\u8BED\u8A00\u5305\u53EF\u5230 [ant-design-vue/es/locale](http://unpkg.com/ant-design-vue/es/locale/) \u76EE\u5F55\u4E0B\u5BFB\u627E | object | - | 1.5.0 |
| pageHeader | \u7EDF\u4E00\u8BBE\u7F6E pageHeader \u7684 ghost\uFF0C\u53C2\u8003 [pageHeader](&lt;(/components/page-header)&gt;) | { ghost: boolean } | &#39;true&#39; | 1.5.0 |
| transformCellText | Table \u6570\u636E\u6E32\u67D3\u524D\u53EF\u4EE5\u518D\u6B21\u6539\u53D8\uFF0C\u4E00\u822C\u7528\u6237\u7A7A\u6570\u636E\u7684\u9ED8\u8BA4\u914D\u7F6E | Function({ text, column, record, index }) =&gt; any | - | 1.5.4 \uFF5C |

## FAQ

#### \u4E3A\u4EC0\u4E48\u6211\u4F7F\u7528\u4E86 ConfigProvider \`locale\`\uFF0C\u65F6\u95F4\u7C7B\u7EC4\u4EF6\u7684\u56FD\u9645\u5316\u8FD8\u6709\u95EE\u9898\uFF1F

\u8BF7\u68C0\u67E5\u662F\u5426\u8BBE\u7F6E\u4E86 \`moment.locale(&#39;zh-cn&#39;)\`\uFF0C\u6216\u8005\u662F\u5426\u6709\u4E24\u4E2A\u7248\u672C\u7684 moment \u5171\u5B58\u3002 \u5982\u679C\u4F60\u4F7F\u7528 Vite \u4F5C\u4E3A\u6784\u5EFA\u5DE5\u5177\uFF0C\u56E0 Vite \u5C1A\u4E0D\u5B8C\u5584\uFF0C\u4F60\u9700\u8981\u5728\u4F60\u7684\u9879\u76EE\u4E2D\u989D\u5916\u6267\u884C \`npm i --save moment\` \u8FDB\u884C\u5B89\u88C5\u3002

#### \u914D\u7F6E \`getPopupContainer\` \u5BFC\u81F4 Modal \u62A5\u9519\uFF1F

\u5F53\u5982\u4E0B\u5168\u5C40\u8BBE\u7F6E \`getPopupContainer\` \u4E3A\u89E6\u53D1\u8282\u70B9\u7684 parentNode \u65F6\uFF0C\u7531\u4E8E Modal \u7684\u7528\u6CD5\u4E0D\u5B58\u5728 \`triggerNode\`\uFF0C\u8FD9\u6837\u4F1A\u5BFC\u81F4 \`triggerNode is undefined\` \u7684\u62A5\u9519\uFF0C\u9700\u8981\u589E\u52A0\u4E00\u4E2A\u5224\u65AD\u6761\u4EF6\u3002

\`\`\`diff
 &lt;ConfigProvider
-  getPopupContainer={triggerNode =&gt; triggerNode.parentNode}
+  getPopupContainer={node =&gt; {
+    if (node) {
+      return node.parentNode;
+    }
+    return document.body;
+  }}
 &gt;
   &lt;App /&gt;
 &lt;/ConfigProvider&gt;
\`\`\`
`,html:`<p>\u4E3A\u7EC4\u4EF6\u63D0\u4F9B\u7EDF\u4E00\u7684\u5168\u5C40\u5316\u914D\u7F6E\u3002</p>
<h2 id="\u4F7F\u7528">\u4F7F\u7528</h2>
<p>ConfigProvider \u4F7F\u7528 Vue \u7684 <a href="https://vuejs.org/v2/api/#provide-inject" target="_blank" rel="noopener noreferrer">provide / inject</a> \u7279\u6027\uFF0C\u53EA\u9700\u5728\u5E94\u7528\u5916\u56F4\u5305\u88F9\u4E00\u6B21\u5373\u53EF\u5168\u5C40\u751F\u6548\u3002</p>
<pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-config-provider</span> <span class="token attr-name">:getPopupContainer</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>getPopupContainer<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>app</span> <span class="token punctuation">/></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-config-provider</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">
  <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    <span class="token literal-property property">methods</span><span class="token operator">:</span> <span class="token punctuation">{</span>
      <span class="token function">getPopupContainer</span><span class="token punctuation">(</span><span class="token parameter">el<span class="token punctuation">,</span> dialogContext</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">if</span> <span class="token punctuation">(</span>dialogContext<span class="token punctuation">)</span> <span class="token punctuation">{</span>
          <span class="token keyword">return</span> dialogContext<span class="token punctuation">.</span><span class="token function">getDialogWrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
          <span class="token keyword">return</span> document<span class="token punctuation">.</span>body<span class="token punctuation">;</span>
        <span class="token punctuation">}</span>
      <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
  <span class="token punctuation">}</span><span class="token punctuation">;</span>
</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>
</code></pre>
<h3 id="content-security-policy">Content Security Policy</h3>
<p>\u90E8\u5206\u7EC4\u4EF6\u4E3A\u4E86\u652F\u6301\u6CE2\u7EB9\u6548\u679C\uFF0C\u4F7F\u7528\u4E86\u52A8\u6001\u6837\u5F0F\u3002\u5982\u679C\u5F00\u542F\u4E86 Content Security Policy (CSP)\uFF0C\u4F60\u53EF\u4EE5\u901A\u8FC7 <code>csp</code> \u5C5E\u6027\u6765\u8FDB\u884C\u914D\u7F6E\uFF1A</p>
<pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-config-provider</span> <span class="token attr-name">:csp</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{ nonce: 'YourNonceCode' }<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-button</span><span class="token punctuation">></span></span>My Button<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-button</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-config-provider</span><span class="token punctuation">></span></span>
</code></pre>
<h2 id="api">API</h2>
<table>
<thead>
<tr>
<th>\u53C2\u6570</th>
<th>\u8BF4\u660E</th>
<th>\u7C7B\u578B</th>
<th>\u9ED8\u8BA4\u503C</th>
<th>\u7248\u672C</th>
</tr>
</thead>
<tbody>
<tr>
<td>autoInsertSpaceInButton</td>
<td>\u8BBE\u7F6E\u4E3A <code>false</code> \u65F6\uFF0C\u79FB\u9664\u6309\u94AE\u4E2D 2 \u4E2A\u6C49\u5B57\u4E4B\u95F4\u7684\u7A7A\u683C</td>
<td>boolean</td>
<td>true</td>
<td></td>
</tr>
<tr>
<td>csp</td>
<td>\u8BBE\u7F6E <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP" target="_blank" rel="noopener noreferrer">Content Security Policy</a> \u914D\u7F6E</td>
<td>{ nonce: string }</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>renderEmpty</td>
<td>\u81EA\u5B9A\u4E49\u7EC4\u4EF6\u7A7A\u72B6\u6001\u3002\u53C2\u8003 <a href="/components/empty/">\u7A7A\u72B6\u6001</a></td>
<td>slot-scope | Function(componentName: string): VNode</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>getPopupContainer</td>
<td>\u5F39\u51FA\u6846\uFF08Select, Tooltip, Menu \u7B49\u7B49\uFF09\u6E32\u67D3\u7236\u8282\u70B9\uFF0C\u9ED8\u8BA4\u6E32\u67D3\u5230 body \u4E0A\u3002</td>
<td>Function(triggerNode, dialogContext)</td>
<td>() =&gt; document.body</td>
<td></td>
</tr>
<tr>
<td>locale</td>
<td>\u8BED\u8A00\u5305\u914D\u7F6E\uFF0C\u8BED\u8A00\u5305\u53EF\u5230 <a href="http://unpkg.com/ant-design-vue/es/locale/" target="_blank" rel="noopener noreferrer">ant-design-vue/es/locale</a> \u76EE\u5F55\u4E0B\u5BFB\u627E</td>
<td>object</td>
<td>-</td>
<td>1.5.0</td>
</tr>
<tr>
<td>pageHeader</td>
<td>\u7EDF\u4E00\u8BBE\u7F6E pageHeader \u7684 ghost\uFF0C\u53C2\u8003 <a href="./(/components/page-header).html">pageHeader</a></td>
<td>{ ghost: boolean }</td>
<td>'true'</td>
<td>1.5.0</td>
</tr>
<tr>
<td>transformCellText</td>
<td>Table \u6570\u636E\u6E32\u67D3\u524D\u53EF\u4EE5\u518D\u6B21\u6539\u53D8\uFF0C\u4E00\u822C\u7528\u6237\u7A7A\u6570\u636E\u7684\u9ED8\u8BA4\u914D\u7F6E</td>
<td>Function({ text, column, record, index }) =&gt; any</td>
<td>-</td>
<td>1.5.4 \uFF5C</td>
</tr>
</tbody>
</table>
<h2 id="faq">FAQ</h2>
<h4 id="\u4E3A\u4EC0\u4E48\u6211\u4F7F\u7528\u4E86-configprovider-locale\uFF0C\u65F6\u95F4\u7C7B\u7EC4\u4EF6\u7684\u56FD\u9645\u5316\u8FD8\u6709\u95EE\u9898\uFF1F">\u4E3A\u4EC0\u4E48\u6211\u4F7F\u7528\u4E86 ConfigProvider <code>locale</code>\uFF0C\u65F6\u95F4\u7C7B\u7EC4\u4EF6\u7684\u56FD\u9645\u5316\u8FD8\u6709\u95EE\u9898\uFF1F</h4>
<p>\u8BF7\u68C0\u67E5\u662F\u5426\u8BBE\u7F6E\u4E86 <code>moment.locale('zh-cn')</code>\uFF0C\u6216\u8005\u662F\u5426\u6709\u4E24\u4E2A\u7248\u672C\u7684 moment \u5171\u5B58\u3002 \u5982\u679C\u4F60\u4F7F\u7528 Vite \u4F5C\u4E3A\u6784\u5EFA\u5DE5\u5177\uFF0C\u56E0 Vite \u5C1A\u4E0D\u5B8C\u5584\uFF0C\u4F60\u9700\u8981\u5728\u4F60\u7684\u9879\u76EE\u4E2D\u989D\u5916\u6267\u884C <code>npm i --save moment</code> \u8FDB\u884C\u5B89\u88C5\u3002</p>
<h4 id="\u914D\u7F6E-getpopupcontainer-\u5BFC\u81F4-modal-\u62A5\u9519\uFF1F">\u914D\u7F6E <code>getPopupContainer</code> \u5BFC\u81F4 Modal \u62A5\u9519\uFF1F</h4>
<p>\u5F53\u5982\u4E0B\u5168\u5C40\u8BBE\u7F6E <code>getPopupContainer</code> \u4E3A\u89E6\u53D1\u8282\u70B9\u7684 parentNode \u65F6\uFF0C\u7531\u4E8E Modal \u7684\u7528\u6CD5\u4E0D\u5B58\u5728 <code>triggerNode</code>\uFF0C\u8FD9\u6837\u4F1A\u5BFC\u81F4 <code>triggerNode is undefined</code> \u7684\u62A5\u9519\uFF0C\u9700\u8981\u589E\u52A0\u4E00\u4E2A\u5224\u65AD\u6761\u4EF6\u3002</p>
<pre class="language-diff" v-pre><code><span class="token unchanged"><span class="token prefix unchanged"> </span><span class="token line">&lt;ConfigProvider
</span></span><span class="token deleted-sign deleted"><span class="token prefix deleted">-</span><span class="token line">  getPopupContainer={triggerNode => triggerNode.parentNode}
</span></span><span class="token inserted-sign inserted"><span class="token prefix inserted">+</span><span class="token line">  getPopupContainer={node => {
</span><span class="token prefix inserted">+</span><span class="token line">    if (node) {
</span><span class="token prefix inserted">+</span><span class="token line">      return node.parentNode;
</span><span class="token prefix inserted">+</span><span class="token line">    }
</span><span class="token prefix inserted">+</span><span class="token line">    return document.body;
</span><span class="token prefix inserted">+</span><span class="token line">  }}
</span></span><span class="token unchanged"><span class="token prefix unchanged"> </span><span class="token line">>
</span><span class="token prefix unchanged"> </span><span class="token line">  &lt;App />
</span><span class="token prefix unchanged"> </span><span class="token line">&lt;/ConfigProvider>
</span></span></code></pre>
`,lastUpdated:1748059052657}},$={class:"markdown"};function nn(o,t,u,i,l,d){return g(),x("article",$,t[0]||(t[0]=[w(`<p>\u4E3A\u7EC4\u4EF6\u63D0\u4F9B\u7EDF\u4E00\u7684\u5168\u5C40\u5316\u914D\u7F6E\u3002</p><h2 id="\u4F7F\u7528">\u4F7F\u7528</h2><p>ConfigProvider \u4F7F\u7528 Vue \u7684 <a href="https://vuejs.org/v2/api/#provide-inject" target="_blank" rel="noopener noreferrer">provide / inject</a> \u7279\u6027\uFF0C\u53EA\u9700\u5728\u5E94\u7528\u5916\u56F4\u5305\u88F9\u4E00\u6B21\u5373\u53EF\u5168\u5C40\u751F\u6548\u3002</p><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-config-provider</span> <span class="token attr-name">:getPopupContainer</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>getPopupContainer<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>app</span> <span class="token punctuation">/&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-config-provider</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
  <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    <span class="token literal-property property">methods</span><span class="token operator">:</span> <span class="token punctuation">{</span>
      <span class="token function">getPopupContainer</span><span class="token punctuation">(</span><span class="token parameter">el<span class="token punctuation">,</span> dialogContext</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">if</span> <span class="token punctuation">(</span>dialogContext<span class="token punctuation">)</span> <span class="token punctuation">{</span>
          <span class="token keyword">return</span> dialogContext<span class="token punctuation">.</span><span class="token function">getDialogWrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
          <span class="token keyword">return</span> document<span class="token punctuation">.</span>body<span class="token punctuation">;</span>
        <span class="token punctuation">}</span>
      <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
  <span class="token punctuation">}</span><span class="token punctuation">;</span>
</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
</code></pre><h3 id="content-security-policy">Content Security Policy</h3><p>\u90E8\u5206\u7EC4\u4EF6\u4E3A\u4E86\u652F\u6301\u6CE2\u7EB9\u6548\u679C\uFF0C\u4F7F\u7528\u4E86\u52A8\u6001\u6837\u5F0F\u3002\u5982\u679C\u5F00\u542F\u4E86 Content Security Policy (CSP)\uFF0C\u4F60\u53EF\u4EE5\u901A\u8FC7 <code>csp</code> \u5C5E\u6027\u6765\u8FDB\u884C\u914D\u7F6E\uFF1A</p><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-config-provider</span> <span class="token attr-name">:csp</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ nonce: &#39;YourNonceCode&#39; }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-button</span><span class="token punctuation">&gt;</span></span>My Button<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-button</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-config-provider</span><span class="token punctuation">&gt;</span></span>
</code></pre><h2 id="api">API</h2><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th><th>\u7248\u672C</th></tr></thead><tbody><tr><td>autoInsertSpaceInButton</td><td>\u8BBE\u7F6E\u4E3A <code>false</code> \u65F6\uFF0C\u79FB\u9664\u6309\u94AE\u4E2D 2 \u4E2A\u6C49\u5B57\u4E4B\u95F4\u7684\u7A7A\u683C</td><td>boolean</td><td>true</td><td></td></tr><tr><td>csp</td><td>\u8BBE\u7F6E <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP" target="_blank" rel="noopener noreferrer">Content Security Policy</a> \u914D\u7F6E</td><td>{ nonce: string }</td><td>-</td><td></td></tr><tr><td>renderEmpty</td><td>\u81EA\u5B9A\u4E49\u7EC4\u4EF6\u7A7A\u72B6\u6001\u3002\u53C2\u8003 <a href="/components/empty/">\u7A7A\u72B6\u6001</a></td><td>slot-scope | Function(componentName: string): VNode</td><td>-</td><td></td></tr><tr><td>getPopupContainer</td><td>\u5F39\u51FA\u6846\uFF08Select, Tooltip, Menu \u7B49\u7B49\uFF09\u6E32\u67D3\u7236\u8282\u70B9\uFF0C\u9ED8\u8BA4\u6E32\u67D3\u5230 body \u4E0A\u3002</td><td>Function(triggerNode, dialogContext)</td><td>() =&gt; document.body</td><td></td></tr><tr><td>locale</td><td>\u8BED\u8A00\u5305\u914D\u7F6E\uFF0C\u8BED\u8A00\u5305\u53EF\u5230 <a href="http://unpkg.com/ant-design-vue/es/locale/" target="_blank" rel="noopener noreferrer">ant-design-vue/es/locale</a> \u76EE\u5F55\u4E0B\u5BFB\u627E</td><td>object</td><td>-</td><td>1.5.0</td></tr><tr><td>pageHeader</td><td>\u7EDF\u4E00\u8BBE\u7F6E pageHeader \u7684 ghost\uFF0C\u53C2\u8003 <a href="./(/components/page-header).html">pageHeader</a></td><td>{ ghost: boolean }</td><td>&#39;true&#39;</td><td>1.5.0</td></tr><tr><td>transformCellText</td><td>Table \u6570\u636E\u6E32\u67D3\u524D\u53EF\u4EE5\u518D\u6B21\u6539\u53D8\uFF0C\u4E00\u822C\u7528\u6237\u7A7A\u6570\u636E\u7684\u9ED8\u8BA4\u914D\u7F6E</td><td>Function({ text, column, record, index }) =&gt; any</td><td>-</td><td>1.5.4 \uFF5C</td></tr></tbody></table><h2 id="faq">FAQ</h2><h4 id="\u4E3A\u4EC0\u4E48\u6211\u4F7F\u7528\u4E86-configprovider-locale\uFF0C\u65F6\u95F4\u7C7B\u7EC4\u4EF6\u7684\u56FD\u9645\u5316\u8FD8\u6709\u95EE\u9898\uFF1F">\u4E3A\u4EC0\u4E48\u6211\u4F7F\u7528\u4E86 ConfigProvider <code>locale</code>\uFF0C\u65F6\u95F4\u7C7B\u7EC4\u4EF6\u7684\u56FD\u9645\u5316\u8FD8\u6709\u95EE\u9898\uFF1F</h4><p>\u8BF7\u68C0\u67E5\u662F\u5426\u8BBE\u7F6E\u4E86 <code>moment.locale(&#39;zh-cn&#39;)</code>\uFF0C\u6216\u8005\u662F\u5426\u6709\u4E24\u4E2A\u7248\u672C\u7684 moment \u5171\u5B58\u3002 \u5982\u679C\u4F60\u4F7F\u7528 Vite \u4F5C\u4E3A\u6784\u5EFA\u5DE5\u5177\uFF0C\u56E0 Vite \u5C1A\u4E0D\u5B8C\u5584\uFF0C\u4F60\u9700\u8981\u5728\u4F60\u7684\u9879\u76EE\u4E2D\u989D\u5916\u6267\u884C <code>npm i --save moment</code> \u8FDB\u884C\u5B89\u88C5\u3002</p><h4 id="\u914D\u7F6E-getpopupcontainer-\u5BFC\u81F4-modal-\u62A5\u9519\uFF1F">\u914D\u7F6E <code>getPopupContainer</code> \u5BFC\u81F4 Modal \u62A5\u9519\uFF1F</h4><p>\u5F53\u5982\u4E0B\u5168\u5C40\u8BBE\u7F6E <code>getPopupContainer</code> \u4E3A\u89E6\u53D1\u8282\u70B9\u7684 parentNode \u65F6\uFF0C\u7531\u4E8E Modal \u7684\u7528\u6CD5\u4E0D\u5B58\u5728 <code>triggerNode</code>\uFF0C\u8FD9\u6837\u4F1A\u5BFC\u81F4 <code>triggerNode is undefined</code> \u7684\u62A5\u9519\uFF0C\u9700\u8981\u589E\u52A0\u4E00\u4E2A\u5224\u65AD\u6761\u4EF6\u3002</p><pre class="language-diff"><code><span class="token unchanged"><span class="token prefix unchanged"> </span><span class="token line">&lt;ConfigProvider
</span></span><span class="token deleted-sign deleted"><span class="token prefix deleted">-</span><span class="token line">  getPopupContainer={triggerNode =&gt; triggerNode.parentNode}
</span></span><span class="token inserted-sign inserted"><span class="token prefix inserted">+</span><span class="token line">  getPopupContainer={node =&gt; {
</span><span class="token prefix inserted">+</span><span class="token line">    if (node) {
</span><span class="token prefix inserted">+</span><span class="token line">      return node.parentNode;
</span><span class="token prefix inserted">+</span><span class="token line">    }
</span><span class="token prefix inserted">+</span><span class="token line">    return document.body;
</span><span class="token prefix inserted">+</span><span class="token line">  }}
</span></span><span class="token unchanged"><span class="token prefix unchanged"> </span><span class="token line">&gt;
</span><span class="token prefix unchanged"> </span><span class="token line">  &lt;App /&gt;
</span><span class="token prefix unchanged"> </span><span class="token line">&lt;/ConfigProvider&gt;
</span></span></code></pre>`,15)]))}var an=r(O,[["render",nn]]);const tn={pageData:{title:"ConfigProvider",description:"",frontmatter:{category:"Components",type:"Other",cols:1,title:"ConfigProvider",cover:"https://gw.alipayobjects.com/zos/alicdn/kegYxl1wj/ConfigProvider.svg"},headers:[{level:2,title:"Usage",slug:"usage",content:"This component provides a configuration to all Vue components underneath itself via the [provide / inject](https://vuejs.org/v2/api/#provide-inject), In the render tree all components will have access to the provided config."},{level:3,title:"Content Security Policy",slug:"content-security-policy",content:"Some components use dynamic style to support wave effect. You can config `csp` prop if Content Security Policy (CSP) is enabled:"},{level:2,title:"API",slug:"api",content:""},{level:2,title:"FAQ",slug:"faq",content:"Does the locale problem still exist in DatePicker even if ConfigProvider `locale` is used?"}],relativePath:"src/docs/config-provider/index.en-US.md",content:`
\`ConfigProvider\` provides a uniform configuration support for components.

## Usage

This component provides a configuration to all Vue components underneath itself via the [provide / inject](https://vuejs.org/v2/api/#provide-inject), In the render tree all components will have access to the provided config.

\`\`\`html
&lt;template&gt;
  &lt;a-config-provider :getPopupContainer=&quot;getPopupContainer&quot;&gt;
    &lt;app /&gt;
  &lt;/a-config-provider&gt;
&lt;/template&gt;
&lt;script&gt;
  export default {
    methods: {
      getPopupContainer(el, dialogContext) {
        if (dialogContext) {
          return dialogContext.getDialogWrap();
        } else {
          return document.body;
        }
      },
    },
  };
&lt;/script&gt;
\`\`\`

### Content Security Policy

Some components use dynamic style to support wave effect. You can config \`csp\` prop if Content Security Policy (CSP) is enabled:

\`\`\`html
&lt;a-config-provider :csp=&quot;{ nonce: &#39;YourNonceCode&#39; }&quot;&gt;
  &lt;a-button&gt;My Button&lt;/a-button&gt;
&lt;/a-config-provider&gt;
\`\`\`

## API

| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| autoInsertSpaceInButton | Set \`false\` to remove space between 2 chinese characters on Button | boolean | true |  |
| csp | Set [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) config | { nonce: string } | - |  |
| renderEmpty | set empty content of components. Ref [Empty](/components/empty/) | slot-scope \\| Function(componentName: string): ReactNode | - |  |
| getPopupContainer | to set the container of the popup element. The default is to create a \`div\` element in \`body\`. | Function(triggerNode, dialogContext) | \`() =&gt; document.body\` |  |
| locale | language package setting, you can find the packages in [ant-design-vue/es/locale](http://unpkg.com/ant-design-vue/es/locale/) | object | - | 1.5.0 |
| prefixCls | set prefix class | string | ant |  |
| pageHeader | Unify the ghost of pageHeader ,Ref [pageHeader](&lt;(/components/page-header)&gt; | { ghost:boolean } | &#39;true&#39; | 1.5.0 |
| transformCellText | Table data can be changed again before rendering. The default configuration of general user empty data. | Function({ text, column, record, index }) =&gt; any | - | 1.5.4 \uFF5C |

## FAQ

#### Does the locale problem still exist in DatePicker even if ConfigProvider \`locale\` is used?

Please make sure you set moment locale by \`moment.locale(&#39;zh-cn&#39;)\` or that you don&#39;t have two different versions of moment. If you use Vite as a build tool, because Vite is not yet complete, you need to additionally execute \`npm i --save moment\` in your project to install it.

#### Modal throw error when setting \`getPopupContainer\`?

When you config \`getPopupContainer\` to parentNode globally, Modal will throw error of \`triggerNode is undefined\` because it did not have a triggerNode.

\`\`\`diff
 &lt;ConfigProvider
-  getPopupContainer={triggerNode =&gt; triggerNode.parentNode}
+  getPopupContainer={node =&gt; {
+    if (node) {
+      return node.parentNode;
+    }
+    return document.body;
+  }}
 &gt;
   &lt;App /&gt;
 &lt;/ConfigProvider&gt;
\`\`\`
`,html:`<p><code>ConfigProvider</code> provides a uniform configuration support for components.</p>
<h2 id="usage">Usage</h2>
<p>This component provides a configuration to all Vue components underneath itself via the <a href="https://vuejs.org/v2/api/#provide-inject" target="_blank" rel="noopener noreferrer">provide / inject</a>, In the render tree all components will have access to the provided config.</p>
<pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-config-provider</span> <span class="token attr-name">:getPopupContainer</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>getPopupContainer<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>app</span> <span class="token punctuation">/></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-config-provider</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">
  <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    <span class="token literal-property property">methods</span><span class="token operator">:</span> <span class="token punctuation">{</span>
      <span class="token function">getPopupContainer</span><span class="token punctuation">(</span><span class="token parameter">el<span class="token punctuation">,</span> dialogContext</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">if</span> <span class="token punctuation">(</span>dialogContext<span class="token punctuation">)</span> <span class="token punctuation">{</span>
          <span class="token keyword">return</span> dialogContext<span class="token punctuation">.</span><span class="token function">getDialogWrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
          <span class="token keyword">return</span> document<span class="token punctuation">.</span>body<span class="token punctuation">;</span>
        <span class="token punctuation">}</span>
      <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
  <span class="token punctuation">}</span><span class="token punctuation">;</span>
</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>
</code></pre>
<h3 id="content-security-policy">Content Security Policy</h3>
<p>Some components use dynamic style to support wave effect. You can config <code>csp</code> prop if Content Security Policy (CSP) is enabled:</p>
<pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-config-provider</span> <span class="token attr-name">:csp</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{ nonce: 'YourNonceCode' }<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-button</span><span class="token punctuation">></span></span>My Button<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-button</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-config-provider</span><span class="token punctuation">></span></span>
</code></pre>
<h2 id="api">API</h2>
<table>
<thead>
<tr>
<th>Property</th>
<th>Description</th>
<th>Type</th>
<th>Default</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>autoInsertSpaceInButton</td>
<td>Set <code>false</code> to remove space between 2 chinese characters on Button</td>
<td>boolean</td>
<td>true</td>
<td></td>
</tr>
<tr>
<td>csp</td>
<td>Set <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP" target="_blank" rel="noopener noreferrer">Content Security Policy</a> config</td>
<td>{ nonce: string }</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>renderEmpty</td>
<td>set empty content of components. Ref <a href="/components/empty/">Empty</a></td>
<td>slot-scope | Function(componentName: string): ReactNode</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>getPopupContainer</td>
<td>to set the container of the popup element. The default is to create a <code>div</code> element in <code>body</code>.</td>
<td>Function(triggerNode, dialogContext)</td>
<td><code>() =&gt; document.body</code></td>
<td></td>
</tr>
<tr>
<td>locale</td>
<td>language package setting, you can find the packages in <a href="http://unpkg.com/ant-design-vue/es/locale/" target="_blank" rel="noopener noreferrer">ant-design-vue/es/locale</a></td>
<td>object</td>
<td>-</td>
<td>1.5.0</td>
</tr>
<tr>
<td>prefixCls</td>
<td>set prefix class</td>
<td>string</td>
<td>ant</td>
<td></td>
</tr>
<tr>
<td>pageHeader</td>
<td>Unify the ghost of pageHeader ,Ref [pageHeader](&lt;(/components/page-header)&gt;</td>
<td>{ ghost:boolean }</td>
<td>'true'</td>
<td>1.5.0</td>
</tr>
<tr>
<td>transformCellText</td>
<td>Table data can be changed again before rendering. The default configuration of general user empty data.</td>
<td>Function({ text, column, record, index }) =&gt; any</td>
<td>-</td>
<td>1.5.4 \uFF5C</td>
</tr>
</tbody>
</table>
<h2 id="faq">FAQ</h2>
<h4 id="does-the-locale-problem-still-exist-in-datepicker-even-if-configprovider-locale-is-used">Does the locale problem still exist in DatePicker even if ConfigProvider <code>locale</code> is used?</h4>
<p>Please make sure you set moment locale by <code>moment.locale('zh-cn')</code> or that you don't have two different versions of moment. If you use Vite as a build tool, because Vite is not yet complete, you need to additionally execute <code>npm i --save moment</code> in your project to install it.</p>
<h4 id="modal-throw-error-when-setting-getpopupcontainer">Modal throw error when setting <code>getPopupContainer</code>?</h4>
<p>When you config <code>getPopupContainer</code> to parentNode globally, Modal will throw error of <code>triggerNode is undefined</code> because it did not have a triggerNode.</p>
<pre class="language-diff" v-pre><code><span class="token unchanged"><span class="token prefix unchanged"> </span><span class="token line">&lt;ConfigProvider
</span></span><span class="token deleted-sign deleted"><span class="token prefix deleted">-</span><span class="token line">  getPopupContainer={triggerNode => triggerNode.parentNode}
</span></span><span class="token inserted-sign inserted"><span class="token prefix inserted">+</span><span class="token line">  getPopupContainer={node => {
</span><span class="token prefix inserted">+</span><span class="token line">    if (node) {
</span><span class="token prefix inserted">+</span><span class="token line">      return node.parentNode;
</span><span class="token prefix inserted">+</span><span class="token line">    }
</span><span class="token prefix inserted">+</span><span class="token line">    return document.body;
</span><span class="token prefix inserted">+</span><span class="token line">  }}
</span></span><span class="token unchanged"><span class="token prefix unchanged"> </span><span class="token line">>
</span><span class="token prefix unchanged"> </span><span class="token line">  &lt;App />
</span><span class="token prefix unchanged"> </span><span class="token line">&lt;/ConfigProvider>
</span></span></code></pre>
`,lastUpdated:1748059052657}},sn={class:"markdown"};function on(o,t,u,i,l,d){return g(),x("article",sn,t[0]||(t[0]=[w(`<p><code>ConfigProvider</code> provides a uniform configuration support for components.</p><h2 id="usage">Usage</h2><p>This component provides a configuration to all Vue components underneath itself via the <a href="https://vuejs.org/v2/api/#provide-inject" target="_blank" rel="noopener noreferrer">provide / inject</a>, In the render tree all components will have access to the provided config.</p><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-config-provider</span> <span class="token attr-name">:getPopupContainer</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>getPopupContainer<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>app</span> <span class="token punctuation">/&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-config-provider</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
  <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    <span class="token literal-property property">methods</span><span class="token operator">:</span> <span class="token punctuation">{</span>
      <span class="token function">getPopupContainer</span><span class="token punctuation">(</span><span class="token parameter">el<span class="token punctuation">,</span> dialogContext</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">if</span> <span class="token punctuation">(</span>dialogContext<span class="token punctuation">)</span> <span class="token punctuation">{</span>
          <span class="token keyword">return</span> dialogContext<span class="token punctuation">.</span><span class="token function">getDialogWrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
          <span class="token keyword">return</span> document<span class="token punctuation">.</span>body<span class="token punctuation">;</span>
        <span class="token punctuation">}</span>
      <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
  <span class="token punctuation">}</span><span class="token punctuation">;</span>
</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
</code></pre><h3 id="content-security-policy">Content Security Policy</h3><p>Some components use dynamic style to support wave effect. You can config <code>csp</code> prop if Content Security Policy (CSP) is enabled:</p><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-config-provider</span> <span class="token attr-name">:csp</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ nonce: &#39;YourNonceCode&#39; }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-button</span><span class="token punctuation">&gt;</span></span>My Button<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-button</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-config-provider</span><span class="token punctuation">&gt;</span></span>
</code></pre><h2 id="api">API</h2><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th><th>Version</th></tr></thead><tbody><tr><td>autoInsertSpaceInButton</td><td>Set <code>false</code> to remove space between 2 chinese characters on Button</td><td>boolean</td><td>true</td><td></td></tr><tr><td>csp</td><td>Set <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP" target="_blank" rel="noopener noreferrer">Content Security Policy</a> config</td><td>{ nonce: string }</td><td>-</td><td></td></tr><tr><td>renderEmpty</td><td>set empty content of components. Ref <a href="/components/empty/">Empty</a></td><td>slot-scope | Function(componentName: string): ReactNode</td><td>-</td><td></td></tr><tr><td>getPopupContainer</td><td>to set the container of the popup element. The default is to create a <code>div</code> element in <code>body</code>.</td><td>Function(triggerNode, dialogContext)</td><td><code>() =&gt; document.body</code></td><td></td></tr><tr><td>locale</td><td>language package setting, you can find the packages in <a href="http://unpkg.com/ant-design-vue/es/locale/" target="_blank" rel="noopener noreferrer">ant-design-vue/es/locale</a></td><td>object</td><td>-</td><td>1.5.0</td></tr><tr><td>prefixCls</td><td>set prefix class</td><td>string</td><td>ant</td><td></td></tr><tr><td>pageHeader</td><td>Unify the ghost of pageHeader ,Ref [pageHeader](&lt;(/components/page-header)&gt;</td><td>{ ghost:boolean }</td><td>&#39;true&#39;</td><td>1.5.0</td></tr><tr><td>transformCellText</td><td>Table data can be changed again before rendering. The default configuration of general user empty data.</td><td>Function({ text, column, record, index }) =&gt; any</td><td>-</td><td>1.5.4 \uFF5C</td></tr></tbody></table><h2 id="faq">FAQ</h2><h4 id="does-the-locale-problem-still-exist-in-datepicker-even-if-configprovider-locale-is-used">Does the locale problem still exist in DatePicker even if ConfigProvider <code>locale</code> is used?</h4><p>Please make sure you set moment locale by <code>moment.locale(&#39;zh-cn&#39;)</code> or that you don&#39;t have two different versions of moment. If you use Vite as a build tool, because Vite is not yet complete, you need to additionally execute <code>npm i --save moment</code> in your project to install it.</p><h4 id="modal-throw-error-when-setting-getpopupcontainer">Modal throw error when setting <code>getPopupContainer</code>?</h4><p>When you config <code>getPopupContainer</code> to parentNode globally, Modal will throw error of <code>triggerNode is undefined</code> because it did not have a triggerNode.</p><pre class="language-diff"><code><span class="token unchanged"><span class="token prefix unchanged"> </span><span class="token line">&lt;ConfigProvider
</span></span><span class="token deleted-sign deleted"><span class="token prefix deleted">-</span><span class="token line">  getPopupContainer={triggerNode =&gt; triggerNode.parentNode}
</span></span><span class="token inserted-sign inserted"><span class="token prefix inserted">+</span><span class="token line">  getPopupContainer={node =&gt; {
</span><span class="token prefix inserted">+</span><span class="token line">    if (node) {
</span><span class="token prefix inserted">+</span><span class="token line">      return node.parentNode;
</span><span class="token prefix inserted">+</span><span class="token line">    }
</span><span class="token prefix inserted">+</span><span class="token line">    return document.body;
</span><span class="token prefix inserted">+</span><span class="token line">  }}
</span></span><span class="token unchanged"><span class="token prefix unchanged"> </span><span class="token line">&gt;
</span><span class="token prefix unchanged"> </span><span class="token line">  &lt;App /&gt;
</span><span class="token prefix unchanged"> </span><span class="token line">&lt;/ConfigProvider&gt;
</span></span></code></pre>`,15)]))}var en=r(tn,[["render",on]]);const pn=y({CN:an,US:en,components:{Locale:E}});function cn(o,t,u,i,l,d){const k=e("Locale"),m=e("demo-sort");return g(),A(m,{cols:1},{default:p(()=>[s(k)]),_:1})}var un=r(pn,[["render",cn]]);export{un as default};