import{d as b,r as f,_ as g,j as c,k as C,l as m,w as o,b as n,f as e,e as t,t as K,M as A,as as v,b5 as h,a as w,n as y}from"./index.c1b9962e.js";const x=b({setup(){const a=f(!1);return{visible:a,showModal:()=>{a.value=!0},handleOk:u=>{console.log(u),a.value=!1}}}});function R(a,s,l,u,d,I){const p=c("a-button"),i=c("a-modal"),r=c("demo-box");return C(),m(r,{jsfiddle:{us:"Basic modal.",cn:"\u7B2C\u4E00\u4E2A\u5BF9\u8BDD\u6846\u3002",docHtml:`

zh-CN

\u7B2C\u4E00\u4E2A\u5BF9\u8BDD\u6846\u3002

en-US

Basic modal.

`,order:0,title:{"zh-CN":"\u57FA\u672C\u7528\u6CD5","en-US":"Basic usage"},relativePath:"src/docs/modal/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWw8L2EtYnV0dG9uPgogICAgPGEtbW9kYWwgdi1tb2RlbDp2aXNpYmxlPSJ2aXNpYmxlIiB0aXRsZT0iQmFzaWMgTW9kYWwiIEBvaz0iaGFuZGxlT2siPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgPC9hLW1vZGFsPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmlzaWJsZSA9IHJlZjxib29sZWFuPihmYWxzZSk7CgogICAgY29uc3Qgc2hvd01vZGFsID0gKCkgPT4gewogICAgICB2aXNpYmxlLnZhbHVlID0gdHJ1ZTsKICAgIH07CgogICAgY29uc3QgaGFuZGxlT2sgPSAoZTogTW91c2VFdmVudCkgPT4gewogICAgICBjb25zb2xlLmxvZyhlKTsKICAgICAgdmlzaWJsZS52YWx1ZSA9IGZhbHNlOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHZpc2libGUsCiAgICAgIHNob3dNb2RhbCwKICAgICAgaGFuZGxlT2ssCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWw8L2EtYnV0dG9uPgogICAgPGEtbW9kYWwgdi1tb2RlbDp2aXNpYmxlPSJ2aXNpYmxlIiB0aXRsZT0iQmFzaWMgTW9kYWwiIEBvaz0iaGFuZGxlT2siPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgPC9hLW1vZGFsPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2aXNpYmxlID0gcmVmKGZhbHNlKTsKICAgIGNvbnN0IHNob3dNb2RhbCA9ICgpID0+IHsKICAgICAgdmlzaWJsZS52YWx1ZSA9IHRydWU7CiAgICB9OwogICAgY29uc3QgaGFuZGxlT2sgPSBlID0+IHsKICAgICAgY29uc29sZS5sb2coZSk7CiAgICAgIHZpc2libGUudmFsdWUgPSBmYWxzZTsKICAgIH07CiAgICByZXR1cm4gewogICAgICB2aXNpYmxlLAogICAgICBzaG93TW9kYWwsCiAgICAgIGhhbmRsZU9rLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[n("div",null,[e(p,{type:"primary",onClick:a.showModal},{default:o(()=>s[1]||(s[1]=[t("Open Modal")])),_:1,__:[1]},8,["onClick"]),e(i,{visible:a.visible,"onUpdate:visible":s[0]||(s[0]=k=>a.visible=k),title:"Basic Modal",onOk:a.handleOk},{default:o(()=>s[2]||(s[2]=[n("p",null,"Some contents...",-1),n("p",null,"Some contents...",-1),n("p",null,"Some contents...",-1)])),_:1,__:[2]},8,["visible","onOk"])])]),htmlCode:o(()=>s[3]||(s[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("Basic Modal"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"e"),n("span",{class:"token operator"},":"),t(" MouseEvent")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("e"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[4]||(s[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("Basic Modal"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(),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"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"e"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("e"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var T=g(x,[["render",R]]);const X=b({setup(){const a=f("Content of the modal"),s=f(!1),l=f(!1);return{modalText:a,visible:s,confirmLoading:l,showModal:()=>{s.value=!0},handleOk:()=>{a.value="The modal will be closed after two seconds",l.value=!0,setTimeout(()=>{s.value=!1,l.value=!1},2e3)}}}});function D(a,s,l,u,d,I){const p=c("a-button"),i=c("a-modal"),r=c("demo-box");return C(),m(r,{jsfiddle:{us:`Asynchronously close a modal dialog when a user clicked OK button, for example, you can use this pattern when you submit a form.`,cn:"\u70B9\u51FB\u786E\u5B9A\u540E\u5F02\u6B65\u5173\u95ED\u5BF9\u8BDD\u6846\uFF0C\u4F8B\u5982\u63D0\u4EA4\u8868\u5355\u3002",docHtml:`

zh-CN

\u70B9\u51FB\u786E\u5B9A\u540E\u5F02\u6B65\u5173\u95ED\u5BF9\u8BDD\u6846\uFF0C\u4F8B\u5982\u63D0\u4EA4\u8868\u5355\u3002

en-US

Asynchronously close a modal dialog when a user clicked OK button, for example, you can use this pattern when you submit a form.

`,order:1,title:{"zh-CN":"\u5F02\u6B65\u5173\u95ED","en-US":"Asynchronously close"},relativePath:"src/docs/modal/demo/async.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWwgd2l0aCBhc3luYyBsb2dpYzwvYS1idXR0b24+CiAgICA8YS1tb2RhbAogICAgICB0aXRsZT0iVGl0bGUiCiAgICAgIHYtbW9kZWw6dmlzaWJsZT0idmlzaWJsZSIKICAgICAgOmNvbmZpcm0tbG9hZGluZz0iY29uZmlybUxvYWRpbmciCiAgICAgIEBvaz0iaGFuZGxlT2siCiAgICA+CiAgICAgIDxwPnt7IG1vZGFsVGV4dCB9fTwvcD4KICAgIDwvYS1tb2RhbD4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IHJlZiwgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IG1vZGFsVGV4dCA9IHJlZjxzdHJpbmc+KCdDb250ZW50IG9mIHRoZSBtb2RhbCcpOwogICAgY29uc3QgdmlzaWJsZSA9IHJlZjxib29sZWFuPihmYWxzZSk7CiAgICBjb25zdCBjb25maXJtTG9hZGluZyA9IHJlZjxib29sZWFuPihmYWxzZSk7CgogICAgY29uc3Qgc2hvd01vZGFsID0gKCkgPT4gewogICAgICB2aXNpYmxlLnZhbHVlID0gdHJ1ZTsKICAgIH07CgogICAgY29uc3QgaGFuZGxlT2sgPSAoKSA9PiB7CiAgICAgIG1vZGFsVGV4dC52YWx1ZSA9ICdUaGUgbW9kYWwgd2lsbCBiZSBjbG9zZWQgYWZ0ZXIgdHdvIHNlY29uZHMnOwogICAgICBjb25maXJtTG9hZGluZy52YWx1ZSA9IHRydWU7CiAgICAgIHNldFRpbWVvdXQoKCkgPT4gewogICAgICAgIHZpc2libGUudmFsdWUgPSBmYWxzZTsKICAgICAgICBjb25maXJtTG9hZGluZy52YWx1ZSA9IGZhbHNlOwogICAgICB9LCAyMDAwKTsKICAgIH07CiAgICByZXR1cm4gewogICAgICBtb2RhbFRleHQsCiAgICAgIHZpc2libGUsCiAgICAgIGNvbmZpcm1Mb2FkaW5nLAogICAgICBzaG93TW9kYWwsCiAgICAgIGhhbmRsZU9rLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWwgd2l0aCBhc3luYyBsb2dpYzwvYS1idXR0b24+CiAgICA8YS1tb2RhbAogICAgICB0aXRsZT0iVGl0bGUiCiAgICAgIHYtbW9kZWw6dmlzaWJsZT0idmlzaWJsZSIKICAgICAgOmNvbmZpcm0tbG9hZGluZz0iY29uZmlybUxvYWRpbmciCiAgICAgIEBvaz0iaGFuZGxlT2siCiAgICA+CiAgICAgIDxwPnt7IG1vZGFsVGV4dCB9fTwvcD4KICAgIDwvYS1tb2RhbD4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgcmVmLCBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgbW9kYWxUZXh0ID0gcmVmKCdDb250ZW50IG9mIHRoZSBtb2RhbCcpOwogICAgY29uc3QgdmlzaWJsZSA9IHJlZihmYWxzZSk7CiAgICBjb25zdCBjb25maXJtTG9hZGluZyA9IHJlZihmYWxzZSk7CiAgICBjb25zdCBzaG93TW9kYWwgPSAoKSA9PiB7CiAgICAgIHZpc2libGUudmFsdWUgPSB0cnVlOwogICAgfTsKICAgIGNvbnN0IGhhbmRsZU9rID0gKCkgPT4gewogICAgICBtb2RhbFRleHQudmFsdWUgPSAnVGhlIG1vZGFsIHdpbGwgYmUgY2xvc2VkIGFmdGVyIHR3byBzZWNvbmRzJzsKICAgICAgY29uZmlybUxvYWRpbmcudmFsdWUgPSB0cnVlOwogICAgICBzZXRUaW1lb3V0KCgpID0+IHsKICAgICAgICB2aXNpYmxlLnZhbHVlID0gZmFsc2U7CiAgICAgICAgY29uZmlybUxvYWRpbmcudmFsdWUgPSBmYWxzZTsKICAgICAgfSwgMjAwMCk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgbW9kYWxUZXh0LAogICAgICB2aXNpYmxlLAogICAgICBjb25maXJtTG9hZGluZywKICAgICAgc2hvd01vZGFsLAogICAgICBoYW5kbGVPaywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[n("div",null,[e(p,{type:"primary",onClick:a.showModal},{default:o(()=>s[1]||(s[1]=[t("Open Modal with async logic")])),_:1,__:[1]},8,["onClick"]),e(i,{title:"Title",visible:a.visible,"onUpdate:visible":s[0]||(s[0]=k=>a.visible=k),"confirm-loading":a.confirmLoading,onOk:a.handleOk},{default:o(()=>[n("p",null,K(a.modalText),1)]),_:1},8,["visible","confirm-loading","onOk"])])]),htmlCode:o(()=>s[2]||(s[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal with async logic"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),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"},'"'),t("Title"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},":confirm-loading"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("confirmLoading"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("{{ modalText }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ref"),n("span",{class:"token punctuation"},","),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" modalText "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Content of the modal'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" confirmLoading "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` modalText`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token string"},"'The modal will be closed after two seconds'"),n("span",{class:"token punctuation"},";"),t(` confirmLoading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` confirmLoading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"2000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` modalText`),n("span",{class:"token punctuation"},","),t(` visible`),n("span",{class:"token punctuation"},","),t(` confirmLoading`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[3]||(s[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal with async logic"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),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"},'"'),t("Title"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},":confirm-loading"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("confirmLoading"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("{{ modalText }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ref"),n("span",{class:"token punctuation"},","),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" modalText "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Content of the modal'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(),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"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" confirmLoading "),n("span",{class:"token operator"},"="),t(),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"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` modalText`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token string"},"'The modal will be closed after two seconds'"),n("span",{class:"token punctuation"},";"),t(` confirmLoading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` confirmLoading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"2000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` modalText`),n("span",{class:"token punctuation"},","),t(` visible`),n("span",{class:"token punctuation"},","),t(` confirmLoading`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var F=g(X,[["render",D]]);const M=b({setup(){const a=f(!1),s=f(!1);return{loading:a,visible:s,showModal:()=>{s.value=!0},handleOk:()=>{a.value=!0,setTimeout(()=>{a.value=!1,s.value=!1},2e3)},handleCancel:()=>{s.value=!1}}}});function J(a,s,l,u,d,I){const p=c("a-button"),i=c("a-modal"),r=c("demo-box");return C(),m(r,{jsfiddle:{us:"A more complex example which define a customized footer button bar,\nthe dialog will change to loading state after clicking submit button, when the loading is over,\nthe modal dialog will be closed.\nYou could set `footer` to `null` if you don't need default footer buttons.",cn:"\u66F4\u590D\u6742\u7684\u4F8B\u5B50\uFF0C\u81EA\u5B9A\u4E49\u4E86\u9875\u811A\u7684\u6309\u94AE\uFF0C\u70B9\u51FB\u63D0\u4EA4\u540E\u8FDB\u5165 loading \u72B6\u6001\uFF0C\u5B8C\u6210\u540E\u5173\u95ED\u3002\n\u4E0D\u9700\u8981\u9ED8\u8BA4\u786E\u5B9A\u53D6\u6D88\u6309\u94AE\u65F6\uFF0C\u4F60\u53EF\u4EE5\u628A `footer` \u8BBE\u4E3A `null`\u3002",docHtml:`

zh-CN

\u66F4\u590D\u6742\u7684\u4F8B\u5B50\uFF0C\u81EA\u5B9A\u4E49\u4E86\u9875\u811A\u7684\u6309\u94AE\uFF0C\u70B9\u51FB\u63D0\u4EA4\u540E\u8FDB\u5165 loading \u72B6\u6001\uFF0C\u5B8C\u6210\u540E\u5173\u95ED\u3002 \u4E0D\u9700\u8981\u9ED8\u8BA4\u786E\u5B9A\u53D6\u6D88\u6309\u94AE\u65F6\uFF0C\u4F60\u53EF\u4EE5\u628A footer \u8BBE\u4E3A null\u3002

en-US

A more complex example which define a customized footer button bar, the dialog will change to loading state after clicking submit button, when the loading is over, the modal dialog will be closed. You could set footer to null if you don't need default footer buttons.

`,order:2,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u9875\u811A","en-US":"Customized Footer"},relativePath:"src/docs/modal/demo/footer.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWwgd2l0aCBjdXN0b21pemVkIGZvb3RlcjwvYS1idXR0b24+CiAgICA8YS1tb2RhbCB2LW1vZGVsOnZpc2libGU9InZpc2libGUiIHRpdGxlPSJUaXRsZSIgQG9rPSJoYW5kbGVPayI+CiAgICAgIDx0ZW1wbGF0ZSAjZm9vdGVyPgogICAgICAgIDxhLWJ1dHRvbiBrZXk9ImJhY2siIEBjbGljaz0iaGFuZGxlQ2FuY2VsIj5SZXR1cm48L2EtYnV0dG9uPgogICAgICAgIDxhLWJ1dHRvbiBrZXk9InN1Ym1pdCIgdHlwZT0icHJpbWFyeSIgOmxvYWRpbmc9ImxvYWRpbmciIEBjbGljaz0iaGFuZGxlT2siPlN1Ym1pdDwvYS1idXR0b24+CiAgICAgIDwvdGVtcGxhdGU+CiAgICAgIDxwPlNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPlNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPlNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPlNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPlNvbWUgY29udGVudHMuLi48L3A+CiAgICA8L2EtbW9kYWw+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBsb2FkaW5nID0gcmVmPGJvb2xlYW4+KGZhbHNlKTsKICAgIGNvbnN0IHZpc2libGUgPSByZWY8Ym9vbGVhbj4oZmFsc2UpOwoKICAgIGNvbnN0IHNob3dNb2RhbCA9ICgpID0+IHsKICAgICAgdmlzaWJsZS52YWx1ZSA9IHRydWU7CiAgICB9OwoKICAgIGNvbnN0IGhhbmRsZU9rID0gKCkgPT4gewogICAgICBsb2FkaW5nLnZhbHVlID0gdHJ1ZTsKICAgICAgc2V0VGltZW91dCgoKSA9PiB7CiAgICAgICAgbG9hZGluZy52YWx1ZSA9IGZhbHNlOwogICAgICAgIHZpc2libGUudmFsdWUgPSBmYWxzZTsKICAgICAgfSwgMjAwMCk7CiAgICB9OwoKICAgIGNvbnN0IGhhbmRsZUNhbmNlbCA9ICgpID0+IHsKICAgICAgdmlzaWJsZS52YWx1ZSA9IGZhbHNlOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIGxvYWRpbmcsCiAgICAgIHZpc2libGUsCiAgICAgIHNob3dNb2RhbCwKICAgICAgaGFuZGxlT2ssCiAgICAgIGhhbmRsZUNhbmNlbCwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWwgd2l0aCBjdXN0b21pemVkIGZvb3RlcjwvYS1idXR0b24+CiAgICA8YS1tb2RhbCB2LW1vZGVsOnZpc2libGU9InZpc2libGUiIHRpdGxlPSJUaXRsZSIgQG9rPSJoYW5kbGVPayI+CiAgICAgIDx0ZW1wbGF0ZSAjZm9vdGVyPgogICAgICAgIDxhLWJ1dHRvbiBrZXk9ImJhY2siIEBjbGljaz0iaGFuZGxlQ2FuY2VsIj5SZXR1cm48L2EtYnV0dG9uPgogICAgICAgIDxhLWJ1dHRvbiBrZXk9InN1Ym1pdCIgdHlwZT0icHJpbWFyeSIgOmxvYWRpbmc9ImxvYWRpbmciIEBjbGljaz0iaGFuZGxlT2siPlN1Ym1pdDwvYS1idXR0b24+CiAgICAgIDwvdGVtcGxhdGU+CiAgICAgIDxwPlNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPlNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPlNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPlNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPlNvbWUgY29udGVudHMuLi48L3A+CiAgICA8L2EtbW9kYWw+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IGxvYWRpbmcgPSByZWYoZmFsc2UpOwogICAgY29uc3QgdmlzaWJsZSA9IHJlZihmYWxzZSk7CiAgICBjb25zdCBzaG93TW9kYWwgPSAoKSA9PiB7CiAgICAgIHZpc2libGUudmFsdWUgPSB0cnVlOwogICAgfTsKICAgIGNvbnN0IGhhbmRsZU9rID0gKCkgPT4gewogICAgICBsb2FkaW5nLnZhbHVlID0gdHJ1ZTsKICAgICAgc2V0VGltZW91dCgoKSA9PiB7CiAgICAgICAgbG9hZGluZy52YWx1ZSA9IGZhbHNlOwogICAgICAgIHZpc2libGUudmFsdWUgPSBmYWxzZTsKICAgICAgfSwgMjAwMCk7CiAgICB9OwogICAgY29uc3QgaGFuZGxlQ2FuY2VsID0gKCkgPT4gewogICAgICB2aXNpYmxlLnZhbHVlID0gZmFsc2U7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgbG9hZGluZywKICAgICAgdmlzaWJsZSwKICAgICAgc2hvd01vZGFsLAogICAgICBoYW5kbGVPaywKICAgICAgaGFuZGxlQ2FuY2VsLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[n("div",null,[e(p,{type:"primary",onClick:a.showModal},{default:o(()=>s[1]||(s[1]=[t("Open Modal with customized footer")])),_:1,__:[1]},8,["onClick"]),e(i,{visible:a.visible,"onUpdate:visible":s[0]||(s[0]=k=>a.visible=k),title:"Title",onOk:a.handleOk},{footer:o(()=>[e(p,{key:"back",onClick:a.handleCancel},{default:o(()=>s[2]||(s[2]=[t("Return")])),_:1,__:[2]},8,["onClick"]),e(p,{key:"submit",type:"primary",loading:a.loading,onClick:a.handleOk},{default:o(()=>s[3]||(s[3]=[t("Submit")])),_:1,__:[3]},8,["loading","onClick"])]),default:o(()=>[s[4]||(s[4]=n("p",null,"Some contents...",-1)),s[5]||(s[5]=n("p",null,"Some contents...",-1)),s[6]||(s[6]=n("p",null,"Some contents...",-1)),s[7]||(s[7]=n("p",null,"Some contents...",-1)),s[8]||(s[8]=n("p",null,"Some contents...",-1))]),_:1,__:[4,5,6,7,8]},8,["visible","onOk"])])]),htmlCode:o(()=>s[9]||(s[9]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal with customized footer"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("Title"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#footer"),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("back"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("handleCancel"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Return"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("submit"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":loading"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("loading"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Submit"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" loading "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` loading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` loading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"2000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleCancel"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` loading`),n("span",{class:"token punctuation"},","),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` handleCancel`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[10]||(s[10]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal with customized footer"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("Title"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#footer"),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("back"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("handleCancel"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Return"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("submit"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":loading"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("loading"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Submit"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" loading "),n("span",{class:"token operator"},"="),t(),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"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(),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"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` loading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` loading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"2000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleCancel"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` loading`),n("span",{class:"token punctuation"},","),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` handleCancel`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var z=g(M,[["render",J]]);const j=b({setup(){return{showConfirm:()=>{A.confirm({title:()=>"Do you Want to delete these items?",icon:()=>e(v),content:()=>e("div",{style:"color:red;"},"Some descriptions"),onOk(){console.log("OK")},onCancel(){console.log("Cancel")},class:"test"})},showDeleteConfirm:()=>{A.confirm({title:()=>"Are you sure delete this task?",icon:()=>e(v),content:()=>"Some descriptions",okText:()=>"Yes",okType:"danger",cancelText:()=>"No",onOk(){console.log("OK")},onCancel(){console.log("Cancel")}})},showPropsConfirm:()=>{A.confirm({title:()=>"Are you sure delete this task?",icon:()=>e(v),content:()=>"Some descriptions",okText:()=>"Yes",okType:"danger",okButtonProps:{disabled:!0},cancelText:()=>"No",onOk(){console.log("OK")},onCancel(){console.log("Cancel")}})}}}});function L(a,s,l,u,d,I){const p=c("a-button"),i=c("demo-box");return C(),m(i,{jsfiddle:{us:"To use `confirm()` to show a confirmation modal dialog.",cn:"\u4F7F\u7528 `confirm()` \u53EF\u4EE5\u5FEB\u6377\u5730\u5F39\u51FA\u786E\u8BA4\u6846\u3002",docHtml:`

zh-CN

\u4F7F\u7528 confirm() \u53EF\u4EE5\u5FEB\u6377\u5730\u5F39\u51FA\u786E\u8BA4\u6846\u3002

en-US

To use confirm() to show a confirmation modal dialog.

`,order:3,title:{"zh-CN":"\u786E\u8BA4\u5BF9\u8BDD\u6846","en-US":"Confirmation modal dialog"},relativePath:"src/docs/modal/demo/confirm.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gQGNsaWNrPSJzaG93Q29uZmlybSI+Q29uZmlybTwvYS1idXR0b24+CiAgICA8YS1idXR0b24gdHlwZT0iZGFzaGVkIiBAY2xpY2s9InNob3dEZWxldGVDb25maXJtIj5EZWxldGU8L2EtYnV0dG9uPgogICAgPGEtYnV0dG9uIHR5cGU9ImRhc2hlZCIgQGNsaWNrPSJzaG93UHJvcHNDb25maXJtIj5XaXRoIGV4dHJhIHByb3BzPC9hLWJ1dHRvbj4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IEV4Y2xhbWF0aW9uQ2lyY2xlT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwppbXBvcnQgeyBjcmVhdGVWTm9kZSwgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJzsKaW1wb3J0IHsgTW9kYWwgfSBmcm9tICdhbnQtZGVzaWduLXZ1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBzaG93Q29uZmlybSA9ICgpID0+IHsKICAgICAgTW9kYWwuY29uZmlybSh7CiAgICAgICAgdGl0bGU6ICgpID0+ICdEbyB5b3UgV2FudCB0byBkZWxldGUgdGhlc2UgaXRlbXM/JywKICAgICAgICBpY29uOiAoKSA9PiBjcmVhdGVWTm9kZShFeGNsYW1hdGlvbkNpcmNsZU91dGxpbmVkKSwKICAgICAgICBjb250ZW50OiAoKSA9PiBjcmVhdGVWTm9kZSgnZGl2JywgeyBzdHlsZTogJ2NvbG9yOnJlZDsnIH0sICdTb21lIGRlc2NyaXB0aW9ucycpLAogICAgICAgIG9uT2soKSB7CiAgICAgICAgICBjb25zb2xlLmxvZygnT0snKTsKICAgICAgICB9LAogICAgICAgIG9uQ2FuY2VsKCkgewogICAgICAgICAgY29uc29sZS5sb2coJ0NhbmNlbCcpOwogICAgICAgIH0sCiAgICAgICAgY2xhc3M6ICd0ZXN0JywKICAgICAgfSk7CiAgICB9OwogICAgY29uc3Qgc2hvd0RlbGV0ZUNvbmZpcm0gPSAoKSA9PiB7CiAgICAgIE1vZGFsLmNvbmZpcm0oewogICAgICAgIHRpdGxlOiAoKSA9PiAnQXJlIHlvdSBzdXJlIGRlbGV0ZSB0aGlzIHRhc2s/JywKICAgICAgICBpY29uOiAoKSA9PiBjcmVhdGVWTm9kZShFeGNsYW1hdGlvbkNpcmNsZU91dGxpbmVkKSwKICAgICAgICBjb250ZW50OiAoKSA9PiAnU29tZSBkZXNjcmlwdGlvbnMnLAogICAgICAgIG9rVGV4dDogKCkgPT4gJ1llcycsCiAgICAgICAgb2tUeXBlOiAnZGFuZ2VyJywKICAgICAgICBjYW5jZWxUZXh0OiAoKSA9PiAnTm8nLAogICAgICAgIG9uT2soKSB7CiAgICAgICAgICBjb25zb2xlLmxvZygnT0snKTsKICAgICAgICB9LAogICAgICAgIG9uQ2FuY2VsKCkgewogICAgICAgICAgY29uc29sZS5sb2coJ0NhbmNlbCcpOwogICAgICAgIH0sCiAgICAgIH0pOwogICAgfTsKICAgIGNvbnN0IHNob3dQcm9wc0NvbmZpcm0gPSAoKSA9PiB7CiAgICAgIE1vZGFsLmNvbmZpcm0oewogICAgICAgIHRpdGxlOiAoKSA9PiAnQXJlIHlvdSBzdXJlIGRlbGV0ZSB0aGlzIHRhc2s/JywKICAgICAgICBpY29uOiAoKSA9PiBjcmVhdGVWTm9kZShFeGNsYW1hdGlvbkNpcmNsZU91dGxpbmVkKSwKICAgICAgICBjb250ZW50OiAoKSA9PiAnU29tZSBkZXNjcmlwdGlvbnMnLAogICAgICAgIG9rVGV4dDogKCkgPT4gJ1llcycsCiAgICAgICAgb2tUeXBlOiAnZGFuZ2VyJywKICAgICAgICBva0J1dHRvblByb3BzOiB7CiAgICAgICAgICBkaXNhYmxlZDogdHJ1ZSwKICAgICAgICB9LAogICAgICAgIGNhbmNlbFRleHQ6ICgpID0+ICdObycsCiAgICAgICAgb25PaygpIHsKICAgICAgICAgIGNvbnNvbGUubG9nKCdPSycpOwogICAgICAgIH0sCiAgICAgICAgb25DYW5jZWwoKSB7CiAgICAgICAgICBjb25zb2xlLmxvZygnQ2FuY2VsJyk7CiAgICAgICAgfSwKICAgICAgfSk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgc2hvd0NvbmZpcm0sCiAgICAgIHNob3dEZWxldGVDb25maXJtLAogICAgICBzaG93UHJvcHNDb25maXJtLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gQGNsaWNrPSJzaG93Q29uZmlybSI+Q29uZmlybTwvYS1idXR0b24+CiAgICA8YS1idXR0b24gdHlwZT0iZGFzaGVkIiBAY2xpY2s9InNob3dEZWxldGVDb25maXJtIj5EZWxldGU8L2EtYnV0dG9uPgogICAgPGEtYnV0dG9uIHR5cGU9ImRhc2hlZCIgQGNsaWNrPSJzaG93UHJvcHNDb25maXJtIj5XaXRoIGV4dHJhIHByb3BzPC9hLWJ1dHRvbj4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgRXhjbGFtYXRpb25DaXJjbGVPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmltcG9ydCB7IGNyZWF0ZVZOb2RlLCBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwppbXBvcnQgeyBNb2RhbCB9IGZyb20gJ2FudC1kZXNpZ24tdnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHNob3dDb25maXJtID0gKCkgPT4gewogICAgICBNb2RhbC5jb25maXJtKHsKICAgICAgICB0aXRsZTogKCkgPT4gJ0RvIHlvdSBXYW50IHRvIGRlbGV0ZSB0aGVzZSBpdGVtcz8nLAogICAgICAgIGljb246ICgpID0+IGNyZWF0ZVZOb2RlKEV4Y2xhbWF0aW9uQ2lyY2xlT3V0bGluZWQpLAogICAgICAgIGNvbnRlbnQ6ICgpID0+CiAgICAgICAgICBjcmVhdGVWTm9kZSgKICAgICAgICAgICAgJ2RpdicsCiAgICAgICAgICAgIHsKICAgICAgICAgICAgICBzdHlsZTogJ2NvbG9yOnJlZDsnLAogICAgICAgICAgICB9LAogICAgICAgICAgICAnU29tZSBkZXNjcmlwdGlvbnMnLAogICAgICAgICAgKSwKICAgICAgICBvbk9rKCkgewogICAgICAgICAgY29uc29sZS5sb2coJ09LJyk7CiAgICAgICAgfSwKICAgICAgICBvbkNhbmNlbCgpIHsKICAgICAgICAgIGNvbnNvbGUubG9nKCdDYW5jZWwnKTsKICAgICAgICB9LAogICAgICAgIGNsYXNzOiAndGVzdCcsCiAgICAgIH0pOwogICAgfTsKICAgIGNvbnN0IHNob3dEZWxldGVDb25maXJtID0gKCkgPT4gewogICAgICBNb2RhbC5jb25maXJtKHsKICAgICAgICB0aXRsZTogKCkgPT4gJ0FyZSB5b3Ugc3VyZSBkZWxldGUgdGhpcyB0YXNrPycsCiAgICAgICAgaWNvbjogKCkgPT4gY3JlYXRlVk5vZGUoRXhjbGFtYXRpb25DaXJjbGVPdXRsaW5lZCksCiAgICAgICAgY29udGVudDogKCkgPT4gJ1NvbWUgZGVzY3JpcHRpb25zJywKICAgICAgICBva1RleHQ6ICgpID0+ICdZZXMnLAogICAgICAgIG9rVHlwZTogJ2RhbmdlcicsCiAgICAgICAgY2FuY2VsVGV4dDogKCkgPT4gJ05vJywKICAgICAgICBvbk9rKCkgewogICAgICAgICAgY29uc29sZS5sb2coJ09LJyk7CiAgICAgICAgfSwKICAgICAgICBvbkNhbmNlbCgpIHsKICAgICAgICAgIGNvbnNvbGUubG9nKCdDYW5jZWwnKTsKICAgICAgICB9LAogICAgICB9KTsKICAgIH07CiAgICBjb25zdCBzaG93UHJvcHNDb25maXJtID0gKCkgPT4gewogICAgICBNb2RhbC5jb25maXJtKHsKICAgICAgICB0aXRsZTogKCkgPT4gJ0FyZSB5b3Ugc3VyZSBkZWxldGUgdGhpcyB0YXNrPycsCiAgICAgICAgaWNvbjogKCkgPT4gY3JlYXRlVk5vZGUoRXhjbGFtYXRpb25DaXJjbGVPdXRsaW5lZCksCiAgICAgICAgY29udGVudDogKCkgPT4gJ1NvbWUgZGVzY3JpcHRpb25zJywKICAgICAgICBva1RleHQ6ICgpID0+ICdZZXMnLAogICAgICAgIG9rVHlwZTogJ2RhbmdlcicsCiAgICAgICAgb2tCdXR0b25Qcm9wczogewogICAgICAgICAgZGlzYWJsZWQ6IHRydWUsCiAgICAgICAgfSwKICAgICAgICBjYW5jZWxUZXh0OiAoKSA9PiAnTm8nLAogICAgICAgIG9uT2soKSB7CiAgICAgICAgICBjb25zb2xlLmxvZygnT0snKTsKICAgICAgICB9LAogICAgICAgIG9uQ2FuY2VsKCkgewogICAgICAgICAgY29uc29sZS5sb2coJ0NhbmNlbCcpOwogICAgICAgIH0sCiAgICAgIH0pOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHNob3dDb25maXJtLAogICAgICBzaG93RGVsZXRlQ29uZmlybSwKICAgICAgc2hvd1Byb3BzQ29uZmlybSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[n("div",null,[e(p,{onClick:a.showConfirm},{default:o(()=>s[0]||(s[0]=[t("Confirm")])),_:1,__:[0]},8,["onClick"]),e(p,{type:"dashed",onClick:a.showDeleteConfirm},{default:o(()=>s[1]||(s[1]=[t("Delete")])),_:1,__:[1]},8,["onClick"]),e(p,{type:"dashed",onClick:a.showPropsConfirm},{default:o(()=>s[2]||(s[2]=[t("With extra props")])),_:1,__:[2]},8,["onClick"])])]),htmlCode:o(()=>s[3]||(s[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("showConfirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("dashed"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showDeleteConfirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Delete"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("dashed"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showPropsConfirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("With extra props"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ExclamationCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" createVNode"),n("span",{class:"token punctuation"},","),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showConfirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Do you Want to delete these items?'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'div'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"style"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'color:red;'"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Some descriptions'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'OK'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onCancel"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Cancel'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token keyword"},"class"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'test'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showDeleteConfirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Are you sure delete this task?'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Some descriptions'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"okText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Yes'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"okType"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'danger'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"cancelText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'No'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'OK'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onCancel"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Cancel'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showPropsConfirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Are you sure delete this task?'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Some descriptions'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"okText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Yes'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"okType"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'danger'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"okButtonProps"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"cancelText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'No'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'OK'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onCancel"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Cancel'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` showConfirm`),n("span",{class:"token punctuation"},","),t(` showDeleteConfirm`),n("span",{class:"token punctuation"},","),t(` showPropsConfirm`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[4]||(s[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("showConfirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("dashed"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showDeleteConfirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Delete"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("dashed"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showPropsConfirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("With extra props"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ExclamationCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" createVNode"),n("span",{class:"token punctuation"},","),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showConfirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Do you Want to delete these items?'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(` `),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t(` `),n("span",{class:"token string"},"'div'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token literal-property property"},"style"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'color:red;'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token string"},"'Some descriptions'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'OK'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onCancel"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Cancel'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token keyword"},"class"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'test'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showDeleteConfirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Are you sure delete this task?'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Some descriptions'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"okText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Yes'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"okType"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'danger'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"cancelText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'No'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'OK'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onCancel"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Cancel'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showPropsConfirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Are you sure delete this task?'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Some descriptions'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"okText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Yes'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"okType"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'danger'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"okButtonProps"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"cancelText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'No'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'OK'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onCancel"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Cancel'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` showConfirm`),n("span",{class:"token punctuation"},","),t(` showDeleteConfirm`),n("span",{class:"token punctuation"},","),t(` showPropsConfirm`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var O=g(j,[["render",L]]);const E=b({setup(){return{info:()=>{A.info({title:()=>"This is a notification message",content:()=>h("div",{},[h("p","some messages...some messages..."),h("p","some messages...some messages...")]),onOk(){console.log("ok")}})},success:()=>{A.success({title:()=>"This is a success message",content:()=>h("div",{},[h("p","some messages...some messages..."),h("p","some messages...some messages...")])})},error:()=>{A.error({title:()=>"This is an error message",content:()=>"some messages...some messages..."})},warning:()=>{A.warning({title:()=>"This is a warning message",content:()=>"some messages...some messages..."})}}}});function U(a,s,l,u,d,I){const p=c("a-button"),i=c("demo-box");return C(),m(i,{jsfiddle:{us:"In the various types of information modal dialog, only one button to close dialog is provided.",cn:"\u5404\u79CD\u7C7B\u578B\u7684\u4FE1\u606F\u63D0\u793A\uFF0C\u53EA\u63D0\u4F9B\u4E00\u4E2A\u6309\u94AE\u7528\u4E8E\u5173\u95ED\u3002",docHtml:`

zh-CN

\u5404\u79CD\u7C7B\u578B\u7684\u4FE1\u606F\u63D0\u793A\uFF0C\u53EA\u63D0\u4F9B\u4E00\u4E2A\u6309\u94AE\u7528\u4E8E\u5173\u95ED\u3002

en-US

In the various types of information modal dialog, only one button to close dialog is provided.

`,order:4,title:{"zh-CN":"\u4FE1\u606F\u63D0\u793A","en-US":"Information modal dialog"},relativePath:"src/docs/modal/demo/info.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gQGNsaWNrPSJpbmZvIj5JbmZvPC9hLWJ1dHRvbj4KICAgIDxhLWJ1dHRvbiBAY2xpY2s9InN1Y2Nlc3MiPlN1Y2Nlc3M8L2EtYnV0dG9uPgogICAgPGEtYnV0dG9uIEBjbGljaz0iZXJyb3IiPkVycm9yPC9hLWJ1dHRvbj4KICAgIDxhLWJ1dHRvbiBAY2xpY2s9Indhcm5pbmciPldhcm5pbmc8L2EtYnV0dG9uPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgTW9kYWwgfSBmcm9tICdhbnQtZGVzaWduLXZ1ZSc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgaCB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBpbmZvID0gKCkgPT4gewogICAgICBNb2RhbC5pbmZvKHsKICAgICAgICB0aXRsZTogKCkgPT4gJ1RoaXMgaXMgYSBub3RpZmljYXRpb24gbWVzc2FnZScsCiAgICAgICAgY29udGVudDogKCkgPT4gaCgnZGl2Jywge30sIFsKICAgICAgICAgIGgoJ3AnLCAnc29tZSBtZXNzYWdlcy4uLnNvbWUgbWVzc2FnZXMuLi4nKSwKICAgICAgICAgIGgoJ3AnLCAnc29tZSBtZXNzYWdlcy4uLnNvbWUgbWVzc2FnZXMuLi4nKSwKICAgICAgICBdKSwKICAgICAgICBvbk9rKCkgewogICAgICAgICAgY29uc29sZS5sb2coJ29rJyk7CiAgICAgICAgfSwKICAgICAgfSk7CiAgICB9OwogICAgY29uc3Qgc3VjY2VzcyA9ICgpID0+IHsKICAgICAgTW9kYWwuc3VjY2Vzcyh7CiAgICAgICAgdGl0bGU6ICgpID0+ICdUaGlzIGlzIGEgc3VjY2VzcyBtZXNzYWdlJywKICAgICAgICBjb250ZW50OiAoKSA9PiBoKCdkaXYnLCB7fSwgWwogICAgICAgICAgaCgncCcsICdzb21lIG1lc3NhZ2VzLi4uc29tZSBtZXNzYWdlcy4uLicpLAogICAgICAgICAgaCgncCcsICdzb21lIG1lc3NhZ2VzLi4uc29tZSBtZXNzYWdlcy4uLicpLAogICAgICAgIF0pLAogICAgICB9KTsKICAgIH07CgogICAgY29uc3QgZXJyb3IgPSAoKSA9PiB7CiAgICAgIE1vZGFsLmVycm9yKHsKICAgICAgICB0aXRsZTogKCkgPT4gJ1RoaXMgaXMgYW4gZXJyb3IgbWVzc2FnZScsCiAgICAgICAgY29udGVudDogKCkgPT4gJ3NvbWUgbWVzc2FnZXMuLi5zb21lIG1lc3NhZ2VzLi4uJywKICAgICAgfSk7CiAgICB9OwoKICAgIGNvbnN0IHdhcm5pbmcgPSAoKSA9PiB7CiAgICAgIE1vZGFsLndhcm5pbmcoewogICAgICAgIHRpdGxlOiAoKSA9PiAnVGhpcyBpcyBhIHdhcm5pbmcgbWVzc2FnZScsCiAgICAgICAgY29udGVudDogKCkgPT4gJ3NvbWUgbWVzc2FnZXMuLi5zb21lIG1lc3NhZ2VzLi4uJywKICAgICAgfSk7CiAgICB9OwoKICAgIHJldHVybiB7CiAgICAgIGluZm8sCiAgICAgIHN1Y2Nlc3MsCiAgICAgIGVycm9yLAogICAgICB3YXJuaW5nLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gQGNsaWNrPSJpbmZvIj5JbmZvPC9hLWJ1dHRvbj4KICAgIDxhLWJ1dHRvbiBAY2xpY2s9InN1Y2Nlc3MiPlN1Y2Nlc3M8L2EtYnV0dG9uPgogICAgPGEtYnV0dG9uIEBjbGljaz0iZXJyb3IiPkVycm9yPC9hLWJ1dHRvbj4KICAgIDxhLWJ1dHRvbiBAY2xpY2s9Indhcm5pbmciPldhcm5pbmc8L2EtYnV0dG9uPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBNb2RhbCB9IGZyb20gJ2FudC1kZXNpZ24tdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCBoIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IGluZm8gPSAoKSA9PiB7CiAgICAgIE1vZGFsLmluZm8oewogICAgICAgIHRpdGxlOiAoKSA9PiAnVGhpcyBpcyBhIG5vdGlmaWNhdGlvbiBtZXNzYWdlJywKICAgICAgICBjb250ZW50OiAoKSA9PgogICAgICAgICAgaCgnZGl2Jywge30sIFsKICAgICAgICAgICAgaCgncCcsICdzb21lIG1lc3NhZ2VzLi4uc29tZSBtZXNzYWdlcy4uLicpLAogICAgICAgICAgICBoKCdwJywgJ3NvbWUgbWVzc2FnZXMuLi5zb21lIG1lc3NhZ2VzLi4uJyksCiAgICAgICAgICBdKSwKICAgICAgICBvbk9rKCkgewogICAgICAgICAgY29uc29sZS5sb2coJ29rJyk7CiAgICAgICAgfSwKICAgICAgfSk7CiAgICB9OwogICAgY29uc3Qgc3VjY2VzcyA9ICgpID0+IHsKICAgICAgTW9kYWwuc3VjY2Vzcyh7CiAgICAgICAgdGl0bGU6ICgpID0+ICdUaGlzIGlzIGEgc3VjY2VzcyBtZXNzYWdlJywKICAgICAgICBjb250ZW50OiAoKSA9PgogICAgICAgICAgaCgnZGl2Jywge30sIFsKICAgICAgICAgICAgaCgncCcsICdzb21lIG1lc3NhZ2VzLi4uc29tZSBtZXNzYWdlcy4uLicpLAogICAgICAgICAgICBoKCdwJywgJ3NvbWUgbWVzc2FnZXMuLi5zb21lIG1lc3NhZ2VzLi4uJyksCiAgICAgICAgICBdKSwKICAgICAgfSk7CiAgICB9OwogICAgY29uc3QgZXJyb3IgPSAoKSA9PiB7CiAgICAgIE1vZGFsLmVycm9yKHsKICAgICAgICB0aXRsZTogKCkgPT4gJ1RoaXMgaXMgYW4gZXJyb3IgbWVzc2FnZScsCiAgICAgICAgY29udGVudDogKCkgPT4gJ3NvbWUgbWVzc2FnZXMuLi5zb21lIG1lc3NhZ2VzLi4uJywKICAgICAgfSk7CiAgICB9OwogICAgY29uc3Qgd2FybmluZyA9ICgpID0+IHsKICAgICAgTW9kYWwud2FybmluZyh7CiAgICAgICAgdGl0bGU6ICgpID0+ICdUaGlzIGlzIGEgd2FybmluZyBtZXNzYWdlJywKICAgICAgICBjb250ZW50OiAoKSA9PiAnc29tZSBtZXNzYWdlcy4uLnNvbWUgbWVzc2FnZXMuLi4nLAogICAgICB9KTsKICAgIH07CiAgICByZXR1cm4gewogICAgICBpbmZvLAogICAgICBzdWNjZXNzLAogICAgICBlcnJvciwKICAgICAgd2FybmluZywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[n("div",null,[e(p,{onClick:a.info},{default:o(()=>s[0]||(s[0]=[t("Info")])),_:1,__:[0]},8,["onClick"]),e(p,{onClick:a.success},{default:o(()=>s[1]||(s[1]=[t("Success")])),_:1,__:[1]},8,["onClick"]),e(p,{onClick:a.error},{default:o(()=>s[2]||(s[2]=[t("Error")])),_:1,__:[2]},8,["onClick"]),e(p,{onClick:a.warning},{default:o(()=>s[3]||(s[3]=[t("Warning")])),_:1,__:[3]},8,["onClick"])])]),htmlCode:o(()=>s[4]||(s[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("info"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Info"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("success"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Success"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("error"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Error"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("warning"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Warning"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" h "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"info"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"info"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'This is a notification message'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'div'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"["),t(` `),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'p'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'p'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'ok'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"success"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"success"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'This is a success message'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'div'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"["),t(` `),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'p'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'p'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"error"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"error"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'This is an error message'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"warning"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"warning"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'This is a warning message'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` info`),n("span",{class:"token punctuation"},","),t(` success`),n("span",{class:"token punctuation"},","),t(` error`),n("span",{class:"token punctuation"},","),t(` warning`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[5]||(s[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("info"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Info"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("success"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Success"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("error"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Error"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("warning"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Warning"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" h "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"info"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"info"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'This is a notification message'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(` `),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'div'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"["),t(` `),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'p'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'p'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'ok'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"success"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"success"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'This is a success message'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(` `),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'div'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"["),t(` `),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'p'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'p'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"error"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"error"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'This is an error message'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"warning"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"warning"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'This is a warning message'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'some messages...some messages...'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` info`),n("span",{class:"token punctuation"},","),t(` success`),n("span",{class:"token punctuation"},","),t(` error`),n("span",{class:"token punctuation"},","),t(` warning`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var Q=g(E,[["render",U]]);const q=b({setup(){const a=f(!1);return{visible:a,showModal:()=>{a.value=!0},hideModal:()=>{a.value=!1},confirm:()=>{A.confirm({title:"Confirm",icon:e(v),content:"Bla bla ...",okText:"\u786E\u8BA4",cancelText:"\u53D6\u6D88"})}}}});function _(a,s,l,u,d,I){const p=c("a-button"),i=c("a-modal"),r=c("demo-box");return C(),m(r,{jsfiddle:{us:"To customize the text of the buttons, you need to set `okText` and `cancelText` props.",cn:"\u8BBE\u7F6E `okText` \u4E0E `cancelText` \u4EE5\u81EA\u5B9A\u4E49\u6309\u94AE\u6587\u5B57\u3002",docHtml:`

zh-CN

\u8BBE\u7F6E okText \u4E0E cancelText \u4EE5\u81EA\u5B9A\u4E49\u6309\u94AE\u6587\u5B57\u3002

en-US

To customize the text of the buttons, you need to set okText and cancelText props.

`,order:5,title:{"zh-CN":"\u56FD\u9645\u5316","en-US":"Internationalization"},relativePath:"src/docs/modal/demo/locale.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk1vZGFsPC9hLWJ1dHRvbj4KICAgIDxhLWJ1dHRvbiBAY2xpY2s9ImNvbmZpcm0iPkNvbmZpcm08L2EtYnV0dG9uPgogICAgPGEtbW9kYWwKICAgICAgdi1tb2RlbDp2aXNpYmxlPSJ2aXNpYmxlIgogICAgICB0aXRsZT0iTW9kYWwiCiAgICAgIG9rLXRleHQ9IuehruiupCIKICAgICAgY2FuY2VsLXRleHQ9IuWPlua2iCIKICAgICAgQG9rPSJoaWRlTW9kYWwiCiAgICA+CiAgICAgIDxwPkJsYSBibGEgLi4uPC9wPgogICAgICA8cD5CbGEgYmxhIC4uLjwvcD4KICAgICAgPHA+QmxhIGJsYSAuLi48L3A+CiAgICA8L2EtbW9kYWw+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBFeGNsYW1hdGlvbkNpcmNsZU91dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYsIGNyZWF0ZVZOb2RlIH0gZnJvbSAndnVlJzsKaW1wb3J0IHsgTW9kYWwgfSBmcm9tICdhbnQtZGVzaWduLXZ1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2aXNpYmxlID0gcmVmPGJvb2xlYW4+KGZhbHNlKTsKCiAgICBjb25zdCBzaG93TW9kYWwgPSAoKSA9PiB7CiAgICAgIHZpc2libGUudmFsdWUgPSB0cnVlOwogICAgfTsKICAgIGNvbnN0IGhpZGVNb2RhbCA9ICgpID0+IHsKICAgICAgdmlzaWJsZS52YWx1ZSA9IGZhbHNlOwogICAgfTsKCiAgICBjb25zdCBjb25maXJtID0gKCkgPT4gewogICAgICBNb2RhbC5jb25maXJtKHsKICAgICAgICB0aXRsZTogJ0NvbmZpcm0nLAogICAgICAgIGljb246IGNyZWF0ZVZOb2RlKEV4Y2xhbWF0aW9uQ2lyY2xlT3V0bGluZWQpLAogICAgICAgIGNvbnRlbnQ6ICdCbGEgYmxhIC4uLicsCiAgICAgICAgb2tUZXh0OiAn56Gu6K6kJywKICAgICAgICBjYW5jZWxUZXh0OiAn5Y+W5raIJywKICAgICAgfSk7CiAgICB9OwoKICAgIHJldHVybiB7CiAgICAgIHZpc2libGUsCiAgICAgIHNob3dNb2RhbCwKICAgICAgaGlkZU1vZGFsLAogICAgICBjb25maXJtLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk1vZGFsPC9hLWJ1dHRvbj4KICAgIDxhLWJ1dHRvbiBAY2xpY2s9ImNvbmZpcm0iPkNvbmZpcm08L2EtYnV0dG9uPgogICAgPGEtbW9kYWwKICAgICAgdi1tb2RlbDp2aXNpYmxlPSJ2aXNpYmxlIgogICAgICB0aXRsZT0iTW9kYWwiCiAgICAgIG9rLXRleHQ9IuehruiupCIKICAgICAgY2FuY2VsLXRleHQ9IuWPlua2iCIKICAgICAgQG9rPSJoaWRlTW9kYWwiCiAgICA+CiAgICAgIDxwPkJsYSBibGEgLi4uPC9wPgogICAgICA8cD5CbGEgYmxhIC4uLjwvcD4KICAgICAgPHA+QmxhIGJsYSAuLi48L3A+CiAgICA8L2EtbW9kYWw+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IEV4Y2xhbWF0aW9uQ2lyY2xlT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiwgY3JlYXRlVk5vZGUgfSBmcm9tICd2dWUnOwppbXBvcnQgeyBNb2RhbCB9IGZyb20gJ2FudC1kZXNpZ24tdnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHZpc2libGUgPSByZWYoZmFsc2UpOwogICAgY29uc3Qgc2hvd01vZGFsID0gKCkgPT4gewogICAgICB2aXNpYmxlLnZhbHVlID0gdHJ1ZTsKICAgIH07CiAgICBjb25zdCBoaWRlTW9kYWwgPSAoKSA9PiB7CiAgICAgIHZpc2libGUudmFsdWUgPSBmYWxzZTsKICAgIH07CiAgICBjb25zdCBjb25maXJtID0gKCkgPT4gewogICAgICBNb2RhbC5jb25maXJtKHsKICAgICAgICB0aXRsZTogJ0NvbmZpcm0nLAogICAgICAgIGljb246IGNyZWF0ZVZOb2RlKEV4Y2xhbWF0aW9uQ2lyY2xlT3V0bGluZWQpLAogICAgICAgIGNvbnRlbnQ6ICdCbGEgYmxhIC4uLicsCiAgICAgICAgb2tUZXh0OiAn56Gu6K6kJywKICAgICAgICBjYW5jZWxUZXh0OiAn5Y+W5raIJywKICAgICAgfSk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgdmlzaWJsZSwKICAgICAgc2hvd01vZGFsLAogICAgICBoaWRlTW9kYWwsCiAgICAgIGNvbmZpcm0sCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[n("div",null,[e(p,{type:"primary",onClick:a.showModal},{default:o(()=>s[1]||(s[1]=[t("Modal")])),_:1,__:[1]},8,["onClick"]),e(p,{onClick:a.confirm},{default:o(()=>s[2]||(s[2]=[t("Confirm")])),_:1,__:[2]},8,["onClick"]),e(i,{visible:a.visible,"onUpdate:visible":s[0]||(s[0]=k=>a.visible=k),title:"Modal","ok-text":"\u786E\u8BA4","cancel-text":"\u53D6\u6D88",onOk:a.hideModal},{default:o(()=>s[3]||(s[3]=[n("p",null,"Bla bla ...",-1),n("p",null,"Bla bla ...",-1),n("p",null,"Bla bla ...",-1)])),_:1,__:[3]},8,["visible","onOk"])])]),htmlCode:o(()=>s[4]||(s[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Modal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("confirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(` `),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"},'"'),t("Modal"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"ok-text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("\u786E\u8BA4"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"cancel-text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("\u53D6\u6D88"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("hideModal"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Bla bla ..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Bla bla ..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Bla bla ..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ExclamationCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref"),n("span",{class:"token punctuation"},","),t(" createVNode "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"hideModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"confirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Confirm'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Bla bla ...'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"okText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u786E\u8BA4'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"cancelText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u53D6\u6D88'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` hideModal`),n("span",{class:"token punctuation"},","),t(` confirm`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[5]||(s[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Modal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("confirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(` `),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"},'"'),t("Modal"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"ok-text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("\u786E\u8BA4"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"cancel-text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("\u53D6\u6D88"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("hideModal"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Bla bla ..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Bla bla ..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Bla bla ..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ExclamationCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref"),n("span",{class:"token punctuation"},","),t(" createVNode "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(),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"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"hideModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"confirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Confirm'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Bla bla ...'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"okText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u786E\u8BA4'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"cancelText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u53D6\u6D88'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` hideModal`),n("span",{class:"token punctuation"},","),t(` confirm`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var $=g(q,[["render",_]]);const nn=b({setup(){return{countDown:()=>{let s=5;const l=A.success({title:"This is a notification message",content:`This modal will be destroyed after ${s} second.`}),u=setInterval(()=>{s-=1,l.update({content:`This modal will be destroyed after ${s} second.`})},1e3);setTimeout(()=>{clearInterval(u),l.destroy()},s*1e3)}}}});function tn(a,s,l,u,d,I){const p=c("a-button"),i=c("demo-box");return C(),m(i,{jsfiddle:{us:"Manually updating and destroying a modal from `Modal.method`.",cn:"\u624B\u52A8\u66F4\u65B0\u548C\u5173\u95ED `Modal.method` \u65B9\u5F0F\u521B\u5EFA\u7684\u5BF9\u8BDD\u6846\u3002",docHtml:`

zh-CN

\u624B\u52A8\u66F4\u65B0\u548C\u5173\u95ED Modal.method \u65B9\u5F0F\u521B\u5EFA\u7684\u5BF9\u8BDD\u6846\u3002

en-US

Manually updating and destroying a modal from Modal.method.

`,order:6,title:{"zh-CN":"\u624B\u52A8\u66F4\u65B0\u548C\u79FB\u9664","en-US":"Manual to update destroy"},relativePath:"src/docs/modal/demo/manual.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWJ1dHRvbiBAY2xpY2s9ImNvdW50RG93biI+T3BlbiBtb2RhbCB0byBjbG9zZSBpbiA1czwvYS1idXR0b24+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBNb2RhbCB9IGZyb20gJ2FudC1kZXNpZ24tdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IGNvdW50RG93biA9ICgpID0+IHsKICAgICAgbGV0IHNlY29uZHNUb0dvID0gNTsKICAgICAgY29uc3QgbW9kYWwgPSBNb2RhbC5zdWNjZXNzKHsKICAgICAgICB0aXRsZTogJ1RoaXMgaXMgYSBub3RpZmljYXRpb24gbWVzc2FnZScsCiAgICAgICAgY29udGVudDogYFRoaXMgbW9kYWwgd2lsbCBiZSBkZXN0cm95ZWQgYWZ0ZXIgJHtzZWNvbmRzVG9Hb30gc2Vjb25kLmAsCiAgICAgIH0pOwogICAgICBjb25zdCBpbnRlcnZhbCA9IHNldEludGVydmFsKCgpID0+IHsKICAgICAgICBzZWNvbmRzVG9HbyAtPSAxOwogICAgICAgIG1vZGFsLnVwZGF0ZSh7CiAgICAgICAgICBjb250ZW50OiBgVGhpcyBtb2RhbCB3aWxsIGJlIGRlc3Ryb3llZCBhZnRlciAke3NlY29uZHNUb0dvfSBzZWNvbmQuYCwKICAgICAgICB9KTsKICAgICAgfSwgMTAwMCk7CiAgICAgIHNldFRpbWVvdXQoKCkgPT4gewogICAgICAgIGNsZWFySW50ZXJ2YWwoaW50ZXJ2YWwpOwogICAgICAgIG1vZGFsLmRlc3Ryb3koKTsKICAgICAgfSwgc2Vjb25kc1RvR28gKiAxMDAwKTsKICAgIH07CiAgICByZXR1cm4gewogICAgICBjb3VudERvd24sCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWJ1dHRvbiBAY2xpY2s9ImNvdW50RG93biI+T3BlbiBtb2RhbCB0byBjbG9zZSBpbiA1czwvYS1idXR0b24+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IE1vZGFsIH0gZnJvbSAnYW50LWRlc2lnbi12dWUnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgY291bnREb3duID0gKCkgPT4gewogICAgICBsZXQgc2Vjb25kc1RvR28gPSA1OwogICAgICBjb25zdCBtb2RhbCA9IE1vZGFsLnN1Y2Nlc3MoewogICAgICAgIHRpdGxlOiAnVGhpcyBpcyBhIG5vdGlmaWNhdGlvbiBtZXNzYWdlJywKICAgICAgICBjb250ZW50OiBgVGhpcyBtb2RhbCB3aWxsIGJlIGRlc3Ryb3llZCBhZnRlciAke3NlY29uZHNUb0dvfSBzZWNvbmQuYCwKICAgICAgfSk7CiAgICAgIGNvbnN0IGludGVydmFsID0gc2V0SW50ZXJ2YWwoKCkgPT4gewogICAgICAgIHNlY29uZHNUb0dvIC09IDE7CiAgICAgICAgbW9kYWwudXBkYXRlKHsKICAgICAgICAgIGNvbnRlbnQ6IGBUaGlzIG1vZGFsIHdpbGwgYmUgZGVzdHJveWVkIGFmdGVyICR7c2Vjb25kc1RvR299IHNlY29uZC5gLAogICAgICAgIH0pOwogICAgICB9LCAxMDAwKTsKICAgICAgc2V0VGltZW91dCgoKSA9PiB7CiAgICAgICAgY2xlYXJJbnRlcnZhbChpbnRlcnZhbCk7CiAgICAgICAgbW9kYWwuZGVzdHJveSgpOwogICAgICB9LCBzZWNvbmRzVG9HbyAqIDEwMDApOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIGNvdW50RG93biwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[e(p,{onClick:a.countDown},{default:o(()=>s[0]||(s[0]=[t("Open modal to close in 5s")])),_:1,__:[0]},8,["onClick"])]),htmlCode:o(()=>s[1]||(s[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("countDown"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open modal to close in 5s"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"countDown"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"let"),t(" secondsToGo "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token number"},"5"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" modal "),n("span",{class:"token operator"},"="),t(" Modal"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"success"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'This is a notification message'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"This modal will be destroyed after "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("secondsToGo"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"}," second."),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" interval "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"setInterval"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` secondsToGo `),n("span",{class:"token operator"},"-="),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),t(` modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"update"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"This modal will be destroyed after "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("secondsToGo"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"}," second."),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"1000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"clearInterval"),n("span",{class:"token punctuation"},"("),t("interval"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"destroy"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(" secondsToGo "),n("span",{class:"token operator"},"*"),t(),n("span",{class:"token number"},"1000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` countDown`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[2]||(s[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("countDown"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open modal to close in 5s"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"countDown"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"let"),t(" secondsToGo "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token number"},"5"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" modal "),n("span",{class:"token operator"},"="),t(" Modal"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"success"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'This is a notification message'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"This modal will be destroyed after "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("secondsToGo"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"}," second."),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" interval "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"setInterval"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` secondsToGo `),n("span",{class:"token operator"},"-="),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),t(` modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"update"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"This modal will be destroyed after "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("secondsToGo"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"}," second."),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"1000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"clearInterval"),n("span",{class:"token punctuation"},"("),t("interval"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"destroy"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(" secondsToGo "),n("span",{class:"token operator"},"*"),t(),n("span",{class:"token number"},"1000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` countDown`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var sn=g(nn,[["render",tn]]);const an=b({setup(){const a=f(!1),s=f(!1);return{modal1Visible:a,modal2Visible:s,setModal1Visible:u=>{a.value=u}}}}),on={id:"components-modal-demo-position"};function en(a,s,l,u,d,I){const p=c("a-button"),i=c("a-modal"),r=c("demo-box");return C(),m(r,{jsfiddle:{us:"You can use `centered`,`style.top` or other styles to set position of modal dialog.",cn:"\u4F7F\u7528 `centered` \u6216\u7C7B\u4F3C `style.top` \u7684\u6837\u5F0F\u6765\u8BBE\u7F6E\u5BF9\u8BDD\u6846\u4F4D\u7F6E\u3002",docHtml:`

zh-CN

\u4F7F\u7528 centered \u6216\u7C7B\u4F3C style.top \u7684\u6837\u5F0F\u6765\u8BBE\u7F6E\u5BF9\u8BDD\u6846\u4F4D\u7F6E\u3002

en-US

You can use centered,style.top or other styles to set position of modal dialog.

`,order:7,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u4F4D\u7F6E","en-US":"To customize the position of modal"},relativePath:"src/docs/modal/demo/position.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXYgaWQ9ImNvbXBvbmVudHMtbW9kYWwtZGVtby1wb3NpdGlvbiI+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzZXRNb2RhbDFWaXNpYmxlKHRydWUpIj4KICAgICAgRGlzcGxheSBhIG1vZGFsIGRpYWxvZyBhdCAyMHB4IHRvIFRvcAogICAgPC9hLWJ1dHRvbj4KICAgIDxhLW1vZGFsCiAgICAgIHRpdGxlPSIyMHB4IHRvIFRvcCIKICAgICAgc3R5bGU9InRvcDogMjBweCIKICAgICAgdi1tb2RlbDp2aXNpYmxlPSJtb2RhbDFWaXNpYmxlIgogICAgICBAb2s9InNldE1vZGFsMVZpc2libGUoZmFsc2UpIgogICAgPgogICAgICA8cD5zb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5zb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5zb21lIGNvbnRlbnRzLi4uPC9wPgogICAgPC9hLW1vZGFsPgogICAgPGJyIC8+CiAgICA8YnIgLz4KICAgIDxhLWJ1dHRvbiB0eXBlPSJwcmltYXJ5IiBAY2xpY2s9Im1vZGFsMlZpc2libGUgPSB0cnVlIj4KICAgICAgVmVydGljYWxseSBjZW50ZXJlZCBtb2RhbCBkaWFsb2cKICAgIDwvYS1idXR0b24+CiAgICA8YS1tb2RhbAogICAgICB2LW1vZGVsOnZpc2libGU9Im1vZGFsMlZpc2libGUiCiAgICAgIHRpdGxlPSJWZXJ0aWNhbGx5IGNlbnRlcmVkIG1vZGFsIGRpYWxvZyIKICAgICAgY2VudGVyZWQKICAgICAgQG9rPSJtb2RhbDJWaXNpYmxlID0gZmFsc2UiCiAgICA+CiAgICAgIDxwPnNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPnNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPnNvbWUgY29udGVudHMuLi48L3A+CiAgICA8L2EtbW9kYWw+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBtb2RhbDFWaXNpYmxlID0gcmVmPGJvb2xlYW4+KGZhbHNlKTsKICAgIGNvbnN0IG1vZGFsMlZpc2libGUgPSByZWY8Ym9vbGVhbj4oZmFsc2UpOwoKICAgIGNvbnN0IHNldE1vZGFsMVZpc2libGUgPSAodmlzaWJsZTogYm9vbGVhbikgPT4gewogICAgICBtb2RhbDFWaXNpYmxlLnZhbHVlID0gdmlzaWJsZTsKICAgIH07CiAgICByZXR1cm4gewogICAgICBtb2RhbDFWaXNpYmxlLAogICAgICBtb2RhbDJWaXNpYmxlLAogICAgICBzZXRNb2RhbDFWaXNpYmxlLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXYgaWQ9ImNvbXBvbmVudHMtbW9kYWwtZGVtby1wb3NpdGlvbiI+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzZXRNb2RhbDFWaXNpYmxlKHRydWUpIj4KICAgICAgRGlzcGxheSBhIG1vZGFsIGRpYWxvZyBhdCAyMHB4IHRvIFRvcAogICAgPC9hLWJ1dHRvbj4KICAgIDxhLW1vZGFsCiAgICAgIHRpdGxlPSIyMHB4IHRvIFRvcCIKICAgICAgc3R5bGU9InRvcDogMjBweCIKICAgICAgdi1tb2RlbDp2aXNpYmxlPSJtb2RhbDFWaXNpYmxlIgogICAgICBAb2s9InNldE1vZGFsMVZpc2libGUoZmFsc2UpIgogICAgPgogICAgICA8cD5zb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5zb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5zb21lIGNvbnRlbnRzLi4uPC9wPgogICAgPC9hLW1vZGFsPgogICAgPGJyIC8+CiAgICA8YnIgLz4KICAgIDxhLWJ1dHRvbiB0eXBlPSJwcmltYXJ5IiBAY2xpY2s9Im1vZGFsMlZpc2libGUgPSB0cnVlIj4KICAgICAgVmVydGljYWxseSBjZW50ZXJlZCBtb2RhbCBkaWFsb2cKICAgIDwvYS1idXR0b24+CiAgICA8YS1tb2RhbAogICAgICB2LW1vZGVsOnZpc2libGU9Im1vZGFsMlZpc2libGUiCiAgICAgIHRpdGxlPSJWZXJ0aWNhbGx5IGNlbnRlcmVkIG1vZGFsIGRpYWxvZyIKICAgICAgY2VudGVyZWQKICAgICAgQG9rPSJtb2RhbDJWaXNpYmxlID0gZmFsc2UiCiAgICA+CiAgICAgIDxwPnNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPnNvbWUgY29udGVudHMuLi48L3A+CiAgICAgIDxwPnNvbWUgY29udGVudHMuLi48L3A+CiAgICA8L2EtbW9kYWw+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IG1vZGFsMVZpc2libGUgPSByZWYoZmFsc2UpOwogICAgY29uc3QgbW9kYWwyVmlzaWJsZSA9IHJlZihmYWxzZSk7CiAgICBjb25zdCBzZXRNb2RhbDFWaXNpYmxlID0gdmlzaWJsZSA9PiB7CiAgICAgIG1vZGFsMVZpc2libGUudmFsdWUgPSB2aXNpYmxlOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIG1vZGFsMVZpc2libGUsCiAgICAgIG1vZGFsMlZpc2libGUsCiAgICAgIHNldE1vZGFsMVZpc2libGUsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[n("div",on,[e(p,{type:"primary",onClick:s[0]||(s[0]=k=>a.setModal1Visible(!0))},{default:o(()=>s[6]||(s[6]=[t(" Display a modal dialog at 20px to Top ")])),_:1,__:[6]}),e(i,{title:"20px to Top",style:{top:"20px"},visible:a.modal1Visible,"onUpdate:visible":s[1]||(s[1]=k=>a.modal1Visible=k),onOk:s[2]||(s[2]=k=>a.setModal1Visible(!1))},{default:o(()=>s[7]||(s[7]=[n("p",null,"some contents...",-1),n("p",null,"some contents...",-1),n("p",null,"some contents...",-1)])),_:1,__:[7]},8,["visible"]),s[10]||(s[10]=n("br",null,null,-1)),s[11]||(s[11]=n("br",null,null,-1)),e(p,{type:"primary",onClick:s[3]||(s[3]=k=>a.modal2Visible=!0)},{default:o(()=>s[8]||(s[8]=[t(" Vertically centered modal dialog ")])),_:1,__:[8]}),e(i,{visible:a.modal2Visible,"onUpdate:visible":s[4]||(s[4]=k=>a.modal2Visible=k),title:"Vertically centered modal dialog",centered:"",onOk:s[5]||(s[5]=k=>a.modal2Visible=!1)},{default:o(()=>s[9]||(s[9]=[n("p",null,"some contents...",-1),n("p",null,"some contents...",-1),n("p",null,"some contents...",-1)])),_:1,__:[9]},8,["visible"])])]),htmlCode:o(()=>s[12]||(s[12]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),t(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("components-modal-demo-position"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("setModal1Visible(true)"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` Display a modal dialog at 20px to Top `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),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"},'"'),t("20px to Top"),n("span",{class:"token punctuation"},'"')]),t(` `),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"},"top"),n("span",{class:"token punctuation"},":"),t(" 20px")]),n("span",{class:"token punctuation"},'"')])]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("modal1Visible"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("setModal1Visible(false)"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("br")]),t(),n("span",{class:"token punctuation"},"/>")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("br")]),t(),n("span",{class:"token punctuation"},"/>")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("modal2Visible = true"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` Vertically centered modal dialog `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("modal2Visible"),n("span",{class:"token punctuation"},'"')]),t(` `),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"},'"'),t("Vertically centered modal dialog"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"centered"),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("modal2Visible = false"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" modal1Visible "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" modal2Visible "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"setModal1Visible"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"visible"),n("span",{class:"token operator"},":"),t(" boolean")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` modal1Visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" visible"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` modal1Visible`),n("span",{class:"token punctuation"},","),t(` modal2Visible`),n("span",{class:"token punctuation"},","),t(` setModal1Visible`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[13]||(s[13]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),t(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("components-modal-demo-position"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("setModal1Visible(true)"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` Display a modal dialog at 20px to Top `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),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"},'"'),t("20px to Top"),n("span",{class:"token punctuation"},'"')]),t(` `),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"},"top"),n("span",{class:"token punctuation"},":"),t(" 20px")]),n("span",{class:"token punctuation"},'"')])]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("modal1Visible"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("setModal1Visible(false)"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("br")]),t(),n("span",{class:"token punctuation"},"/>")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("br")]),t(),n("span",{class:"token punctuation"},"/>")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("modal2Visible = true"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` Vertically centered modal dialog `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("modal2Visible"),n("span",{class:"token punctuation"},'"')]),t(` `),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"},'"'),t("Vertically centered modal dialog"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"centered"),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("modal2Visible = false"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" modal1Visible "),n("span",{class:"token operator"},"="),t(),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"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(" modal2Visible "),n("span",{class:"token operator"},"="),t(),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"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"setModal1Visible"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"visible"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` modal1Visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" visible"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` modal1Visible`),n("span",{class:"token punctuation"},","),t(` modal2Visible`),n("span",{class:"token punctuation"},","),t(` setModal1Visible`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var cn=g(an,[["render",en]]);const pn=b({setup(){return{showConfirm:()=>{for(let s=0;s<3;s+=1)setTimeout(()=>{A.confirm({content:()=>"destroy all",icon:()=>e(v),onOk(){return new Promise((l,u)=>{setTimeout(Math.random()>.5?l:u,1e3)}).catch(()=>console.log("Oops errors!"))},cancelText:()=>"Click to destroy all",onCancel(){A.destroyAll()}})},s*500)}}}});function ln(a,s,l,u,d,I){const p=c("a-button"),i=c("demo-box");return C(),m(i,{jsfiddle:{us:"`Modal.destroyAll()` could destroy all confirmation modal dialogs. Usually, you can use it in router change event to destroy confirm modal dialog automatically",cn:"\u4F7F\u7528 `Modal.destroyAll()` \u53EF\u4EE5\u9500\u6BC1\u5F39\u51FA\u7684\u786E\u8BA4\u7A97\u3002\u901A\u5E38\u7528\u4E8E\u8DEF\u7531\u76D1\u542C\u5F53\u4E2D\uFF0C\u5904\u7406\u8DEF\u7531\u524D\u8FDB\u3001\u540E\u9000\u4E0D\u80FD\u9500\u6BC1\u786E\u8BA4\u5BF9\u8BDD\u6846\u7684\u95EE\u9898\u3002",docHtml:`

zh-CN

\u4F7F\u7528 Modal.destroyAll() \u53EF\u4EE5\u9500\u6BC1\u5F39\u51FA\u7684\u786E\u8BA4\u7A97\u3002\u901A\u5E38\u7528\u4E8E\u8DEF\u7531\u76D1\u542C\u5F53\u4E2D\uFF0C\u5904\u7406\u8DEF\u7531\u524D\u8FDB\u3001\u540E\u9000\u4E0D\u80FD\u9500\u6BC1\u786E\u8BA4\u5BF9\u8BDD\u6846\u7684\u95EE\u9898\u3002

en-US

Modal.destroyAll() could destroy all confirmation modal dialogs. Usually, you can use it in router change event to destroy confirm modal dialog automatically

`,order:8,title:{"zh-CN":"\u9500\u6BC1\u786E\u8BA4\u5BF9\u8BDD\u6846","en-US":"destroy confirmation modal dialog"},relativePath:"src/docs/modal/demo/confirm-router.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWJ1dHRvbiBAY2xpY2s9InNob3dDb25maXJtIj5Db25maXJtPC9hLWJ1dHRvbj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IEV4Y2xhbWF0aW9uQ2lyY2xlT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwppbXBvcnQgeyBjcmVhdGVWTm9kZSwgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJzsKaW1wb3J0IHsgTW9kYWwgfSBmcm9tICdhbnQtZGVzaWduLXZ1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBzaG93Q29uZmlybSA9ICgpID0+IHsKICAgICAgZm9yIChsZXQgaSA9IDA7IGkgPCAzOyBpICs9IDEpIHsKICAgICAgICBzZXRUaW1lb3V0KCgpID0+IHsKICAgICAgICAgIE1vZGFsLmNvbmZpcm0oewogICAgICAgICAgICBjb250ZW50OiAoKSA9PiAnZGVzdHJveSBhbGwnLAogICAgICAgICAgICBpY29uOiAoKSA9PiBjcmVhdGVWTm9kZShFeGNsYW1hdGlvbkNpcmNsZU91dGxpbmVkKSwKICAgICAgICAgICAgb25PaygpIHsKICAgICAgICAgICAgICByZXR1cm4gbmV3IFByb21pc2UoKHJlc29sdmUsIHJlamVjdCkgPT4gewogICAgICAgICAgICAgICAgc2V0VGltZW91dChNYXRoLnJhbmRvbSgpID4gMC41ID8gcmVzb2x2ZSA6IHJlamVjdCwgMTAwMCk7CiAgICAgICAgICAgICAgfSkuY2F0Y2goKCkgPT4gY29uc29sZS5sb2coJ09vcHMgZXJyb3JzIScpKTsKICAgICAgICAgICAgfSwKICAgICAgICAgICAgY2FuY2VsVGV4dDogKCkgPT4gJ0NsaWNrIHRvIGRlc3Ryb3kgYWxsJywKICAgICAgICAgICAgb25DYW5jZWwoKSB7CiAgICAgICAgICAgICAgTW9kYWwuZGVzdHJveUFsbCgpOwogICAgICAgICAgICB9LAogICAgICAgICAgfSk7CiAgICAgICAgfSwgaSAqIDUwMCk7CiAgICAgIH0KICAgIH07CiAgICByZXR1cm4gewogICAgICBzaG93Q29uZmlybSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWJ1dHRvbiBAY2xpY2s9InNob3dDb25maXJtIj5Db25maXJtPC9hLWJ1dHRvbj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgRXhjbGFtYXRpb25DaXJjbGVPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmltcG9ydCB7IGNyZWF0ZVZOb2RlLCBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwppbXBvcnQgeyBNb2RhbCB9IGZyb20gJ2FudC1kZXNpZ24tdnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHNob3dDb25maXJtID0gKCkgPT4gewogICAgICBmb3IgKGxldCBpID0gMDsgaSA8IDM7IGkgKz0gMSkgewogICAgICAgIHNldFRpbWVvdXQoKCkgPT4gewogICAgICAgICAgTW9kYWwuY29uZmlybSh7CiAgICAgICAgICAgIGNvbnRlbnQ6ICgpID0+ICdkZXN0cm95IGFsbCcsCiAgICAgICAgICAgIGljb246ICgpID0+IGNyZWF0ZVZOb2RlKEV4Y2xhbWF0aW9uQ2lyY2xlT3V0bGluZWQpLAogICAgICAgICAgICBvbk9rKCkgewogICAgICAgICAgICAgIHJldHVybiBuZXcgUHJvbWlzZSgocmVzb2x2ZSwgcmVqZWN0KSA9PiB7CiAgICAgICAgICAgICAgICBzZXRUaW1lb3V0KE1hdGgucmFuZG9tKCkgPiAwLjUgPyByZXNvbHZlIDogcmVqZWN0LCAxMDAwKTsKICAgICAgICAgICAgICB9KS5jYXRjaCgoKSA9PiBjb25zb2xlLmxvZygnT29wcyBlcnJvcnMhJykpOwogICAgICAgICAgICB9LAogICAgICAgICAgICBjYW5jZWxUZXh0OiAoKSA9PiAnQ2xpY2sgdG8gZGVzdHJveSBhbGwnLAogICAgICAgICAgICBvbkNhbmNlbCgpIHsKICAgICAgICAgICAgICBNb2RhbC5kZXN0cm95QWxsKCk7CiAgICAgICAgICAgIH0sCiAgICAgICAgICB9KTsKICAgICAgICB9LCBpICogNTAwKTsKICAgICAgfQogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHNob3dDb25maXJtLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[e(p,{onClick:a.showConfirm},{default:o(()=>s[0]||(s[0]=[t("Confirm")])),_:1,__:[0]},8,["onClick"])]),htmlCode:o(()=>s[1]||(s[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("showConfirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ExclamationCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" createVNode"),n("span",{class:"token punctuation"},","),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showConfirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"for"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"let"),t(" i "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),t(" i "),n("span",{class:"token operator"},"<"),t(),n("span",{class:"token number"},"3"),n("span",{class:"token punctuation"},";"),t(" i "),n("span",{class:"token operator"},"+="),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'destroy all'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token keyword"},"new"),t(),n("span",{class:"token class-name"},"Promise"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("resolve"),n("span",{class:"token punctuation"},","),t(" reject")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),t("Math"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"random"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"0.5"),t(),n("span",{class:"token operator"},"?"),t(" resolve "),n("span",{class:"token operator"},":"),t(" reject"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"1000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"catch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(" console"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Oops errors!'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"cancelText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Click to destroy all'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onCancel"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"destroyAll"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(" i "),n("span",{class:"token operator"},"*"),t(),n("span",{class:"token number"},"500"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` showConfirm`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[2]||(s[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("showConfirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ExclamationCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" createVNode"),n("span",{class:"token punctuation"},","),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showConfirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"for"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"let"),t(" i "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),t(" i "),n("span",{class:"token operator"},"<"),t(),n("span",{class:"token number"},"3"),n("span",{class:"token punctuation"},";"),t(" i "),n("span",{class:"token operator"},"+="),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'destroy all'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token keyword"},"new"),t(),n("span",{class:"token class-name"},"Promise"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("resolve"),n("span",{class:"token punctuation"},","),t(" reject")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),t("Math"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"random"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"0.5"),t(),n("span",{class:"token operator"},"?"),t(" resolve "),n("span",{class:"token operator"},":"),t(" reject"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"1000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"catch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(" console"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Oops errors!'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"cancelText"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Click to destroy all'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onCancel"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"destroyAll"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(" i "),n("span",{class:"token operator"},"*"),t(),n("span",{class:"token number"},"500"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` showConfirm`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var un=g(pn,[["render",ln]]);const kn=b({setup(){return{showConfirm:()=>{A.confirm({title:()=>"Do you want to delete these items?",icon:()=>e(v),content:()=>"When clicked the OK button, this dialog will be closed after 1 second",onOk(){return new Promise((s,l)=>{setTimeout(Math.random()>.5?s:l,1e3)}).catch(()=>console.log("Oops errors!"))},onCancel(){}})}}}});function dn(a,s,l,u,d,I){const p=c("a-button"),i=c("demo-box");return C(),m(i,{jsfiddle:{us:"To use `confirm()` to popup confirmation modal dialog. Let onCancel/onOk function return a promise object to\ndelay closing the dialog.",cn:"\u4F7F\u7528 `confirm()` \u53EF\u4EE5\u5FEB\u6377\u5730\u5F39\u51FA\u786E\u8BA4\u6846\u3002onCancel/onOk \u8FD4\u56DE promise \u53EF\u4EE5\u5EF6\u8FDF\u5173\u95ED",docHtml:`

zh-CN

\u4F7F\u7528 confirm() \u53EF\u4EE5\u5FEB\u6377\u5730\u5F39\u51FA\u786E\u8BA4\u6846\u3002onCancel/onOk \u8FD4\u56DE promise \u53EF\u4EE5\u5EF6\u8FDF\u5173\u95ED

en-US

To use confirm() to popup confirmation modal dialog. Let onCancel/onOk function return a promise object to delay closing the dialog.

`,order:9,title:{"zh-CN":"\u786E\u8BA4\u5BF9\u8BDD\u6846(promise)","en-US":"Confirmation modal dialog use promise"},relativePath:"src/docs/modal/demo/confirm-promise.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWJ1dHRvbiBAY2xpY2s9InNob3dDb25maXJtIj5Db25maXJtPC9hLWJ1dHRvbj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IEV4Y2xhbWF0aW9uQ2lyY2xlT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwppbXBvcnQgeyBjcmVhdGVWTm9kZSwgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJzsKaW1wb3J0IHsgTW9kYWwgfSBmcm9tICdhbnQtZGVzaWduLXZ1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBzaG93Q29uZmlybSA9ICgpID0+IHsKICAgICAgTW9kYWwuY29uZmlybSh7CiAgICAgICAgdGl0bGU6ICgpID0+ICdEbyB5b3Ugd2FudCB0byBkZWxldGUgdGhlc2UgaXRlbXM/JywKICAgICAgICBpY29uOiAoKSA9PiBjcmVhdGVWTm9kZShFeGNsYW1hdGlvbkNpcmNsZU91dGxpbmVkKSwKICAgICAgICBjb250ZW50OiAoKSA9PiAnV2hlbiBjbGlja2VkIHRoZSBPSyBidXR0b24sIHRoaXMgZGlhbG9nIHdpbGwgYmUgY2xvc2VkIGFmdGVyIDEgc2Vjb25kJywKICAgICAgICBvbk9rKCkgewogICAgICAgICAgcmV0dXJuIG5ldyBQcm9taXNlKChyZXNvbHZlLCByZWplY3QpID0+IHsKICAgICAgICAgICAgc2V0VGltZW91dChNYXRoLnJhbmRvbSgpID4gMC41ID8gcmVzb2x2ZSA6IHJlamVjdCwgMTAwMCk7CiAgICAgICAgICB9KS5jYXRjaCgoKSA9PiBjb25zb2xlLmxvZygnT29wcyBlcnJvcnMhJykpOwogICAgICAgIH0sCiAgICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uby1lbXB0eS1mdW5jdGlvbgogICAgICAgIG9uQ2FuY2VsKCkge30sCiAgICAgIH0pOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHNob3dDb25maXJtLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWJ1dHRvbiBAY2xpY2s9InNob3dDb25maXJtIj5Db25maXJtPC9hLWJ1dHRvbj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgRXhjbGFtYXRpb25DaXJjbGVPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmltcG9ydCB7IGNyZWF0ZVZOb2RlLCBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwppbXBvcnQgeyBNb2RhbCB9IGZyb20gJ2FudC1kZXNpZ24tdnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHNob3dDb25maXJtID0gKCkgPT4gewogICAgICBNb2RhbC5jb25maXJtKHsKICAgICAgICB0aXRsZTogKCkgPT4gJ0RvIHlvdSB3YW50IHRvIGRlbGV0ZSB0aGVzZSBpdGVtcz8nLAogICAgICAgIGljb246ICgpID0+IGNyZWF0ZVZOb2RlKEV4Y2xhbWF0aW9uQ2lyY2xlT3V0bGluZWQpLAogICAgICAgIGNvbnRlbnQ6ICgpID0+ICdXaGVuIGNsaWNrZWQgdGhlIE9LIGJ1dHRvbiwgdGhpcyBkaWFsb2cgd2lsbCBiZSBjbG9zZWQgYWZ0ZXIgMSBzZWNvbmQnLAogICAgICAgIG9uT2soKSB7CiAgICAgICAgICByZXR1cm4gbmV3IFByb21pc2UoKHJlc29sdmUsIHJlamVjdCkgPT4gewogICAgICAgICAgICBzZXRUaW1lb3V0KE1hdGgucmFuZG9tKCkgPiAwLjUgPyByZXNvbHZlIDogcmVqZWN0LCAxMDAwKTsKICAgICAgICAgIH0pLmNhdGNoKCgpID0+IGNvbnNvbGUubG9nKCdPb3BzIGVycm9ycyEnKSk7CiAgICAgICAgfSwKICAgICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25vLWVtcHR5LWZ1bmN0aW9uCiAgICAgICAgb25DYW5jZWwoKSB7fSwKICAgICAgfSk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgc2hvd0NvbmZpcm0sCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[e(p,{onClick:a.showConfirm},{default:o(()=>s[0]||(s[0]=[t("Confirm")])),_:1,__:[0]},8,["onClick"])]),htmlCode:o(()=>s[1]||(s[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("showConfirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ExclamationCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" createVNode"),n("span",{class:"token punctuation"},","),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showConfirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Do you want to delete these items?'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'When clicked the OK button, this dialog will be closed after 1 second'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token keyword"},"new"),t(),n("span",{class:"token class-name"},"Promise"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("resolve"),n("span",{class:"token punctuation"},","),t(" reject")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),t("Math"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"random"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"0.5"),t(),n("span",{class:"token operator"},"?"),t(" resolve "),n("span",{class:"token operator"},":"),t(" reject"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"1000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"catch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(" console"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Oops errors!'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token comment"},"// eslint-disable-next-line @typescript-eslint/no-empty-function"),t(` `),n("span",{class:"token function"},"onCancel"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` showConfirm`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[2]||(s[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("showConfirm"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Confirm"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ExclamationCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" createVNode"),n("span",{class:"token punctuation"},","),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Modal "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showConfirm"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` Modal`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"confirm"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function-variable function"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'Do you want to delete these items?'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),t("ExclamationCircleOutlined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function-variable function"},"content"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token string"},"'When clicked the OK button, this dialog will be closed after 1 second'"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token function"},"onOk"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token keyword"},"new"),t(),n("span",{class:"token class-name"},"Promise"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("resolve"),n("span",{class:"token punctuation"},","),t(" reject")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),t("Math"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"random"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"0.5"),t(),n("span",{class:"token operator"},"?"),t(" resolve "),n("span",{class:"token operator"},":"),t(" reject"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"1000"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"catch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(" console"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Oops errors!'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token comment"},"// eslint-disable-next-line @typescript-eslint/no-empty-function"),t(` `),n("span",{class:"token function"},"onCancel"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` showConfirm`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var rn=g(kn,[["render",dn]]);const gn=b({setup(){const a=f(!1);return{visible:a,showModal:()=>{a.value=!0},handleOk:u=>{console.log(u),a.value=!1}}}});function Cn(a,s,l,u,d,I){const p=c("a-button"),i=c("a-modal"),r=c("demo-box");return C(),m(r,{jsfiddle:{us:"Use `width` to set the width of the modal dialog",cn:"\u4F7F\u7528`width`\u6765\u8BBE\u7F6E\u6A21\u6001\u5BF9\u8BDD\u6846\u7684\u5BBD\u5EA6",docHtml:`

zh-CN

\u4F7F\u7528width\u6765\u8BBE\u7F6E\u6A21\u6001\u5BF9\u8BDD\u6846\u7684\u5BBD\u5EA6

en-US

Use width to set the width of the modal dialog

`,order:10,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u6A21\u6001\u7684\u5BBD\u5EA6","en-US":"To customize the width of modal"},relativePath:"src/docs/modal/demo/width.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWwgb2YgMTAwMHB4IHdpZHRoPC9hLWJ1dHRvbj4KICAgIDxhLW1vZGFsIHYtbW9kZWw6dmlzaWJsZT0idmlzaWJsZSIgd2lkdGg9IjEwMDBweCIgdGl0bGU9IkJhc2ljIE1vZGFsIiBAb2s9ImhhbmRsZU9rIj4KICAgICAgPHA+U29tZSBjb250ZW50cy4uLjwvcD4KICAgICAgPHA+U29tZSBjb250ZW50cy4uLjwvcD4KICAgICAgPHA+U29tZSBjb250ZW50cy4uLjwvcD4KICAgIDwvYS1tb2RhbD4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHZpc2libGUgPSByZWY8Ym9vbGVhbj4oZmFsc2UpOwoKICAgIGNvbnN0IHNob3dNb2RhbCA9ICgpID0+IHsKICAgICAgdmlzaWJsZS52YWx1ZSA9IHRydWU7CiAgICB9OwoKICAgIGNvbnN0IGhhbmRsZU9rID0gKGU6IE1vdXNlRXZlbnQpID0+IHsKICAgICAgY29uc29sZS5sb2coZSk7CiAgICAgIHZpc2libGUudmFsdWUgPSBmYWxzZTsKICAgIH07CiAgICByZXR1cm4gewogICAgICB2aXNpYmxlLAogICAgICBzaG93TW9kYWwsCiAgICAgIGhhbmRsZU9rLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWwgb2YgMTAwMHB4IHdpZHRoPC9hLWJ1dHRvbj4KICAgIDxhLW1vZGFsIHYtbW9kZWw6dmlzaWJsZT0idmlzaWJsZSIgd2lkdGg9IjEwMDBweCIgdGl0bGU9IkJhc2ljIE1vZGFsIiBAb2s9ImhhbmRsZU9rIj4KICAgICAgPHA+U29tZSBjb250ZW50cy4uLjwvcD4KICAgICAgPHA+U29tZSBjb250ZW50cy4uLjwvcD4KICAgICAgPHA+U29tZSBjb250ZW50cy4uLjwvcD4KICAgIDwvYS1tb2RhbD4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmlzaWJsZSA9IHJlZihmYWxzZSk7CiAgICBjb25zdCBzaG93TW9kYWwgPSAoKSA9PiB7CiAgICAgIHZpc2libGUudmFsdWUgPSB0cnVlOwogICAgfTsKICAgIGNvbnN0IGhhbmRsZU9rID0gZSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKGUpOwogICAgICB2aXNpYmxlLnZhbHVlID0gZmFsc2U7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgdmlzaWJsZSwKICAgICAgc2hvd01vZGFsLAogICAgICBoYW5kbGVPaywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[n("div",null,[e(p,{type:"primary",onClick:a.showModal},{default:o(()=>s[1]||(s[1]=[t("Open Modal of 1000px width")])),_:1,__:[1]},8,["onClick"]),e(i,{visible:a.visible,"onUpdate:visible":s[0]||(s[0]=k=>a.visible=k),width:"1000px",title:"Basic Modal",onOk:a.handleOk},{default:o(()=>s[2]||(s[2]=[n("p",null,"Some contents...",-1),n("p",null,"Some contents...",-1),n("p",null,"Some contents...",-1)])),_:1,__:[2]},8,["visible","onOk"])])]),htmlCode:o(()=>s[3]||(s[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal of 1000px width"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"width"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("1000px"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("Basic Modal"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"e"),n("span",{class:"token operator"},":"),t(" MouseEvent")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("e"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[4]||(s[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal of 1000px width"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"width"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("1000px"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("Basic Modal"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(),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"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"e"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("e"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var In=g(gn,[["render",Cn]]);const bn=b({setup(){const a=f(!1);return{visible:a,showModal:()=>{a.value=!0},handleOk:u=>{console.log(u),a.value=!1}}}});function mn(a,s,l,u,d,I){const p=c("a-button"),i=c("a-modal"),r=c("demo-box");return C(),m(r,{jsfiddle:{us:"Full screen by custom style.",cn:"\u4F7F\u7528\u6837\u5F0F\u5B9A\u4E49\u4E00\u4E2A\u5168\u5C4F\u5F39\u7A97",docHtml:`

zh-CN

\u4F7F\u7528\u6837\u5F0F\u5B9A\u4E49\u4E00\u4E2A\u5168\u5C4F\u5F39\u7A97

en-US

Full screen by custom style.

`,order:0,title:{"zh-CN":"\u5168\u5C4F","en-US":"full screen"},relativePath:"src/docs/modal/demo/fullscreen.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWw8L2EtYnV0dG9uPgogICAgPGEtbW9kYWwKICAgICAgdi1tb2RlbDp2aXNpYmxlPSJ2aXNpYmxlIgogICAgICB0aXRsZT0iQmFzaWMgTW9kYWwiCiAgICAgIEBvaz0iaGFuZGxlT2siCiAgICAgIHdpZHRoPSIxMDAlIgogICAgICB3cmFwQ2xhc3NOYW1lPSJmdWxsLW1vZGFsIgogICAgPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgPC9hLW1vZGFsPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmlzaWJsZSA9IHJlZjxib29sZWFuPihmYWxzZSk7CgogICAgY29uc3Qgc2hvd01vZGFsID0gKCkgPT4gewogICAgICB2aXNpYmxlLnZhbHVlID0gdHJ1ZTsKICAgIH07CgogICAgY29uc3QgaGFuZGxlT2sgPSAoZTogTW91c2VFdmVudCkgPT4gewogICAgICBjb25zb2xlLmxvZyhlKTsKICAgICAgdmlzaWJsZS52YWx1ZSA9IGZhbHNlOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHZpc2libGUsCiAgICAgIHNob3dNb2RhbCwKICAgICAgaGFuZGxlT2ssCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KPHN0eWxlIGxhbmc9Imxlc3MiPgouZnVsbC1tb2RhbCB7CiAgLmFudC1tb2RhbCB7CiAgICBtYXgtd2lkdGg6IDEwMCU7CiAgICB0b3A6IDA7CiAgICBwYWRkaW5nLWJvdHRvbTogMDsKICAgIG1hcmdpbjogMDsKICB9CiAgLmFudC1tb2RhbC1jb250ZW50IHsKICAgIGRpc3BsYXk6IGZsZXg7CiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uOwogICAgaGVpZ2h0OiBjYWxjKDEwMHZoKTsKICB9CiAgLmFudC1tb2RhbC1ib2R5IHsKICAgIGZsZXg6IDE7CiAgfQp9Cjwvc3R5bGU+Cg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWw8L2EtYnV0dG9uPgogICAgPGEtbW9kYWwKICAgICAgdi1tb2RlbDp2aXNpYmxlPSJ2aXNpYmxlIgogICAgICB0aXRsZT0iQmFzaWMgTW9kYWwiCiAgICAgIEBvaz0iaGFuZGxlT2siCiAgICAgIHdpZHRoPSIxMDAlIgogICAgICB3cmFwQ2xhc3NOYW1lPSJmdWxsLW1vZGFsIgogICAgPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgPC9hLW1vZGFsPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2aXNpYmxlID0gcmVmKGZhbHNlKTsKICAgIGNvbnN0IHNob3dNb2RhbCA9ICgpID0+IHsKICAgICAgdmlzaWJsZS52YWx1ZSA9IHRydWU7CiAgICB9OwogICAgY29uc3QgaGFuZGxlT2sgPSBlID0+IHsKICAgICAgY29uc29sZS5sb2coZSk7CiAgICAgIHZpc2libGUudmFsdWUgPSBmYWxzZTsKICAgIH07CiAgICByZXR1cm4gewogICAgICB2aXNpYmxlLAogICAgICBzaG93TW9kYWwsCiAgICAgIGhhbmRsZU9rLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZSBsYW5nPSJsZXNzIj4KLmZ1bGwtbW9kYWwgewogIC5hbnQtbW9kYWwgewogICAgbWF4LXdpZHRoOiAxMDAlOwogICAgdG9wOiAwOwogICAgcGFkZGluZy1ib3R0b206IDA7CiAgICBtYXJnaW46IDA7CiAgfQogIC5hbnQtbW9kYWwtY29udGVudCB7CiAgICBkaXNwbGF5OiBmbGV4OwogICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjsKICAgIGhlaWdodDogY2FsYygxMDB2aCk7CiAgfQogIC5hbnQtbW9kYWwtYm9keSB7CiAgICBmbGV4OiAxOwogIH0KfQo8L3N0eWxlPg=="}},{default:o(()=>[n("div",null,[e(p,{type:"primary",onClick:a.showModal},{default:o(()=>s[1]||(s[1]=[t("Open Modal")])),_:1,__:[1]},8,["onClick"]),e(i,{visible:a.visible,"onUpdate:visible":s[0]||(s[0]=k=>a.visible=k),title:"Basic Modal",onOk:a.handleOk,width:"100%",wrapClassName:"full-modal"},{default:o(()=>s[2]||(s[2]=[n("p",null,"Some contents...",-1),n("p",null,"Some contents...",-1),n("p",null,"Some contents...",-1)])),_:1,__:[2]},8,["visible","onOk"])])]),htmlCode:o(()=>s[3]||(s[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(` `),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"},'"'),t("Basic Modal"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"width"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("100%"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"wrapClassName"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("full-modal"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"e"),n("span",{class:"token operator"},":"),t(" MouseEvent")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("e"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("style")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("less"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[t(` `),n("span",{class:"token selector"},".full-modal"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token selector"},".ant-modal"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token property"},"max-width"),n("span",{class:"token punctuation"},":"),t(" 100%"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token property"},"top"),n("span",{class:"token punctuation"},":"),t(" 0"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token property"},"padding-bottom"),n("span",{class:"token punctuation"},":"),t(" 0"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),t(" 0"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),t(` `),n("span",{class:"token selector"},".ant-modal-content"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),t(" flex"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token property"},"flex-direction"),n("span",{class:"token punctuation"},":"),t(" column"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),t(),n("span",{class:"token function"},"calc"),n("span",{class:"token punctuation"},"("),t("100vh"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),t(` `),n("span",{class:"token selector"},".ant-modal-body"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token property"},"flex"),n("span",{class:"token punctuation"},":"),t(" 1"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),t(` `),n("span",{class:"token punctuation"},"}"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[4]||(s[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(` `),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"},'"'),t("Basic Modal"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"width"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("100%"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"wrapClassName"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("full-modal"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(),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"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"e"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("e"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("style")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("less"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[t(` `),n("span",{class:"token selector"},".full-modal"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token selector"},".ant-modal"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token property"},"max-width"),n("span",{class:"token punctuation"},":"),t(" 100%"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token property"},"top"),n("span",{class:"token punctuation"},":"),t(" 0"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token property"},"padding-bottom"),n("span",{class:"token punctuation"},":"),t(" 0"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),t(" 0"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),t(` `),n("span",{class:"token selector"},".ant-modal-content"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),t(" flex"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token property"},"flex-direction"),n("span",{class:"token punctuation"},":"),t(" column"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),t(),n("span",{class:"token function"},"calc"),n("span",{class:"token punctuation"},"("),t("100vh"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),t(` `),n("span",{class:"token selector"},".ant-modal-body"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token property"},"flex"),n("span",{class:"token punctuation"},":"),t(" 1"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),t(` `),n("span",{class:"token punctuation"},"}"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var An=g(bn,[["render",mn]]);const fn=b({setup(){const a=f(!1);return{visible:a,showModal:()=>{a.value=!0},handleOk:d=>{console.log(d),a.value=!1},handleCancel:d=>{console.log(d),a.value=!1}}}});function hn(a,s,l,u,d,I){const p=c("a-button"),i=c("a-modal"),r=c("demo-box");return C(),m(r,{jsfiddle:{us:"Passing `okButtonProps` and `cancelButtonProps` can customize the ok button and cancel button props.",cn:"\u4F20\u5165 `okButtonProps` \u548C `cancelButtonProps` \u53EF\u5206\u522B\u81EA\u5B9A\u4E49\u786E\u5B9A\u6309\u94AE\u548C\u53D6\u6D88\u6309\u94AE\u7684 props\u3002",docHtml:`

zh-CN

\u4F20\u5165 okButtonProps \u548C cancelButtonProps \u53EF\u5206\u522B\u81EA\u5B9A\u4E49\u786E\u5B9A\u6309\u94AE\u548C\u53D6\u6D88\u6309\u94AE\u7684 props\u3002

en-US

Passing okButtonProps and cancelButtonProps can customize the ok button and cancel button props.

`,order:11,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u9875\u811A\u6309\u94AE\u5C5E\u6027","en-US":"Customize footer buttons props"},relativePath:"src/docs/modal/demo/button-props.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWwgd2l0aCBjdXN0b21pemVkIGJ1dHRvbiBwcm9wczwvYS1idXR0b24+CiAgICA8YS1tb2RhbAogICAgICB2LW1vZGVsOnZpc2libGU9InZpc2libGUiCiAgICAgIHRpdGxlPSJCYXNpYyBNb2RhbCIKICAgICAgOm9rLWJ1dHRvbi1wcm9wcz0ieyBkaXNhYmxlZDogdHJ1ZSB9IgogICAgICA6Y2FuY2VsLWJ1dHRvbi1wcm9wcz0ieyBkaXNhYmxlZDogdHJ1ZSB9IgogICAgICBAb2s9ImhhbmRsZU9rIgogICAgPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgPC9hLW1vZGFsPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmlzaWJsZSA9IHJlZjxib29sZWFuPihmYWxzZSk7CgogICAgY29uc3Qgc2hvd01vZGFsID0gKCkgPT4gewogICAgICB2aXNpYmxlLnZhbHVlID0gdHJ1ZTsKICAgIH07CgogICAgY29uc3QgaGFuZGxlT2sgPSAoZTogTW91c2VFdmVudCkgPT4gewogICAgICBjb25zb2xlLmxvZyhlKTsKICAgICAgdmlzaWJsZS52YWx1ZSA9IGZhbHNlOwogICAgfTsKCiAgICBjb25zdCBoYW5kbGVDYW5jZWwgPSAoZTogTW91c2VFdmVudCkgPT4gewogICAgICBjb25zb2xlLmxvZyhlKTsKICAgICAgdmlzaWJsZS52YWx1ZSA9IGZhbHNlOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHZpc2libGUsCiAgICAgIHNob3dNb2RhbCwKICAgICAgaGFuZGxlT2ssCiAgICAgIGhhbmRsZUNhbmNlbCwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1idXR0b24gdHlwZT0icHJpbWFyeSIgQGNsaWNrPSJzaG93TW9kYWwiPk9wZW4gTW9kYWwgd2l0aCBjdXN0b21pemVkIGJ1dHRvbiBwcm9wczwvYS1idXR0b24+CiAgICA8YS1tb2RhbAogICAgICB2LW1vZGVsOnZpc2libGU9InZpc2libGUiCiAgICAgIHRpdGxlPSJCYXNpYyBNb2RhbCIKICAgICAgOm9rLWJ1dHRvbi1wcm9wcz0ieyBkaXNhYmxlZDogdHJ1ZSB9IgogICAgICA6Y2FuY2VsLWJ1dHRvbi1wcm9wcz0ieyBkaXNhYmxlZDogdHJ1ZSB9IgogICAgICBAb2s9ImhhbmRsZU9rIgogICAgPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgICA8cD5Tb21lIGNvbnRlbnRzLi4uPC9wPgogICAgPC9hLW1vZGFsPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2aXNpYmxlID0gcmVmKGZhbHNlKTsKICAgIGNvbnN0IHNob3dNb2RhbCA9ICgpID0+IHsKICAgICAgdmlzaWJsZS52YWx1ZSA9IHRydWU7CiAgICB9OwogICAgY29uc3QgaGFuZGxlT2sgPSBlID0+IHsKICAgICAgY29uc29sZS5sb2coZSk7CiAgICAgIHZpc2libGUudmFsdWUgPSBmYWxzZTsKICAgIH07CiAgICBjb25zdCBoYW5kbGVDYW5jZWwgPSBlID0+IHsKICAgICAgY29uc29sZS5sb2coZSk7CiAgICAgIHZpc2libGUudmFsdWUgPSBmYWxzZTsKICAgIH07CiAgICByZXR1cm4gewogICAgICB2aXNpYmxlLAogICAgICBzaG93TW9kYWwsCiAgICAgIGhhbmRsZU9rLAogICAgICBoYW5kbGVDYW5jZWwsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[n("div",null,[e(p,{type:"primary",onClick:a.showModal},{default:o(()=>s[1]||(s[1]=[t("Open Modal with customized button props")])),_:1,__:[1]},8,["onClick"]),e(i,{visible:a.visible,"onUpdate:visible":s[0]||(s[0]=k=>a.visible=k),title:"Basic Modal","ok-button-props":{disabled:!0},"cancel-button-props":{disabled:!0},onOk:a.handleOk},{default:o(()=>s[2]||(s[2]=[n("p",null,"Some contents...",-1),n("p",null,"Some contents...",-1),n("p",null,"Some contents...",-1)])),_:1,__:[2]},8,["visible","onOk"])])]),htmlCode:o(()=>s[3]||(s[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal with customized button props"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(` `),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"},'"'),t("Basic Modal"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},":ok-button-props"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ disabled: true }"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},":cancel-button-props"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ disabled: true }"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"e"),n("span",{class:"token operator"},":"),t(" MouseEvent")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("e"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleCancel"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"e"),n("span",{class:"token operator"},":"),t(" MouseEvent")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("e"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` handleCancel`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),jsVersionHtml:o(()=>s[4]||(s[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("showModal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Open Modal with customized button props"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-modal")]),t(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("visible")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("visible"),n("span",{class:"token punctuation"},'"')]),t(` `),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"},'"'),t("Basic Modal"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},":ok-button-props"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ disabled: true }"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},":cancel-button-props"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ disabled: true }"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token attr-name"},"@ok"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOk"),n("span",{class:"token punctuation"},'"')]),t(` `),n("span",{class:"token punctuation"},">")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Some contents..."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(` `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(` `),n("span",{class:"token keyword"},"const"),t(" visible "),n("span",{class:"token operator"},"="),t(),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"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"showModal"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOk"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"e"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("e"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleCancel"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"e"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(` console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("e"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` visible`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(` visible`),n("span",{class:"token punctuation"},","),t(` showModal`),n("span",{class:"token punctuation"},","),t(` handleOk`),n("span",{class:"token punctuation"},","),t(` handleCancel`),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),t(` `)])],-1)])),_:1})}var vn=g(fn,[["render",hn]]);const wn={pageData:{title:"Modal",description:"",frontmatter:{category:"Components",type:"\u53CD\u9988",title:"Modal",subtitle:"\u5BF9\u8BDD\u6846",cover:"https://gw.alipayobjects.com/zos/alicdn/3StSdUlSH/Modal.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:"\u9700\u8981\u7528\u6237\u5904\u7406\u4E8B\u52A1\uFF0C\u53C8\u4E0D\u5E0C\u671B\u8DF3\u8F6C\u9875\u9762\u4EE5\u81F4\u6253\u65AD\u5DE5\u4F5C\u6D41\u7A0B\u65F6\uFF0C\u53EF\u4EE5\u4F7F\u7528 `Modal` \u5728\u5F53\u524D\u9875\u9762\u6B63\u4E2D\u6253\u5F00\u4E00\u4E2A\u6D6E\u5C42\uFF0C\u627F\u8F7D\u76F8\u5E94\u7684\u64CD\u4F5C\u3002"},{level:2,title:"API",slug:"api",content:""},{level:3,title:"\u4E8B\u4EF6",slug:"\u4E8B\u4EF6",content:""},{level:3,title:"Modal.method()",slug:"modal-method",content:"\u5305\u62EC\uFF1A"}],relativePath:"src/docs/modal/index.zh-CN.md",content:` \u6A21\u6001\u5BF9\u8BDD\u6846\u3002 ## \u4F55\u65F6\u4F7F\u7528 \u9700\u8981\u7528\u6237\u5904\u7406\u4E8B\u52A1\uFF0C\u53C8\u4E0D\u5E0C\u671B\u8DF3\u8F6C\u9875\u9762\u4EE5\u81F4\u6253\u65AD\u5DE5\u4F5C\u6D41\u7A0B\u65F6\uFF0C\u53EF\u4EE5\u4F7F\u7528 \`Modal\` \u5728\u5F53\u524D\u9875\u9762\u6B63\u4E2D\u6253\u5F00\u4E00\u4E2A\u6D6E\u5C42\uFF0C\u627F\u8F7D\u76F8\u5E94\u7684\u64CD\u4F5C\u3002 \u53E6\u5916\u5F53\u9700\u8981\u4E00\u4E2A\u7B80\u6D01\u7684\u786E\u8BA4\u6846\u8BE2\u95EE\u7528\u6237\u65F6\uFF0C\u53EF\u4EE5\u4F7F\u7528 \`Modal.confirm()\` \u7B49\u8BED\u6CD5\u7CD6\u65B9\u6CD5\u3002 ## API | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C | | --- | --- | --- | --- | --- | | afterClose | Modal \u5B8C\u5168\u5173\u95ED\u540E\u7684\u56DE\u8C03 | function | \u65E0 | | | bodyStyle | Modal body \u6837\u5F0F | object | {} | | | cancelText | \u53D6\u6D88\u6309\u94AE\u6587\u5B57 | string\\| slot | \u53D6\u6D88 | | | centered | \u5782\u76F4\u5C45\u4E2D\u5C55\u793A Modal | Boolean | \`false\` | | | closable | \u662F\u5426\u663E\u793A\u53F3\u4E0A\u89D2\u7684\u5173\u95ED\u6309\u94AE | boolean | true | | | closeIcon | \u81EA\u5B9A\u4E49\u5173\u95ED\u56FE\u6807 | VNode \\| slot | - | | | confirmLoading | \u786E\u5B9A\u6309\u94AE loading | boolean | \u65E0 | | | destroyOnClose | \u5173\u95ED\u65F6\u9500\u6BC1 Modal \u91CC\u7684\u5B50\u5143\u7D20 | boolean | false | | | footer | \u5E95\u90E8\u5185\u5BB9\uFF0C\u5F53\u4E0D\u9700\u8981\u9ED8\u8BA4\u5E95\u90E8\u6309\u94AE\u65F6\uFF0C\u53EF\u4EE5\u8BBE\u4E3A \`:footer="null"\` | string\\|slot | \u786E\u5B9A\u53D6\u6D88\u6309\u94AE | | | forceRender | \u5F3A\u5236\u6E32\u67D3 Modal | boolean | false | | | getContainer | \u6307\u5B9A Modal \u6302\u8F7D\u7684 HTML \u8282\u70B9 | (instance): HTMLElement | () => document.body | | | keyboard | \u662F\u5426\u652F\u6301\u952E\u76D8 esc \u5173\u95ED | boolean | true | | | mask | \u662F\u5426\u5C55\u793A\u906E\u7F69 | Boolean | true | | | maskClosable | \u70B9\u51FB\u8499\u5C42\u662F\u5426\u5141\u8BB8\u5173\u95ED | boolean | true | | | maskStyle | \u906E\u7F69\u6837\u5F0F | object | {} | | | okText | \u786E\u8BA4\u6309\u94AE\u6587\u5B57 | string\\|slot | \u786E\u5B9A | | | okType | \u786E\u8BA4\u6309\u94AE\u7C7B\u578B | string | primary | | | okButtonProps | ok \u6309\u94AE props | [ButtonProps](/components/button/#API) | - | | | cancelButtonProps | cancel \u6309\u94AE props | [ButtonProps](/components/button/#API) | - | | | title | \u6807\u9898 | string\\|slot | \u65E0 | | | visible(v-model) | \u5BF9\u8BDD\u6846\u662F\u5426\u53EF\u89C1 | boolean | \u65E0 | | | width | \u5BBD\u5EA6 | string\\|number | 520 | | | wrapClassName | \u5BF9\u8BDD\u6846\u5916\u5C42\u5BB9\u5668\u7684\u7C7B\u540D | string | - | | | zIndex | \u8BBE\u7F6E Modal \u7684 \`z-index\` | Number | 1000 | | | dialogStyle | \u53EF\u7528\u4E8E\u8BBE\u7F6E\u6D6E\u5C42\u7684\u6837\u5F0F\uFF0C\u8C03\u6574\u6D6E\u5C42\u4F4D\u7F6E\u7B49 | object | - | | | dialogClass | \u53EF\u7528\u4E8E\u8BBE\u7F6E\u6D6E\u5C42\u7684\u7C7B\u540D | string | - | | ### \u4E8B\u4EF6 | \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E | \u56DE\u8C03\u53C2\u6570 | | -------- | ------------------------------------ | ----------- | | cancel | \u70B9\u51FB\u906E\u7F69\u5C42\u6216\u53F3\u4E0A\u89D2\u53C9\u6216\u53D6\u6D88\u6309\u94AE\u7684\u56DE\u8C03 | function(e) | | ok | \u70B9\u51FB\u786E\u5B9A\u56DE\u8C03 | function(e) | #### \u6CE8\u610F > \`<Modal />\` \u9ED8\u8BA4\u5173\u95ED\u540E\u72B6\u6001\u4E0D\u4F1A\u81EA\u52A8\u6E05\u7A7A, \u5982\u679C\u5E0C\u671B\u6BCF\u6B21\u6253\u5F00\u90FD\u662F\u65B0\u5185\u5BB9\uFF0C\u8BF7\u8BBE\u7F6E \`destroyOnClose\`\u3002 ### Modal.method() \u5305\u62EC\uFF1A - \`Modal.info\` - \`Modal.success\` - \`Modal.error\` - \`Modal.warning\` - \`Modal.confirm\` \u4EE5\u4E0A\u5747\u4E3A\u4E00\u4E2A\u51FD\u6570\uFF0C\u53C2\u6570\u4E3A object\uFF0C\u5177\u4F53\u5C5E\u6027\u5982\u4E0B\uFF1A | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C | | --- | --- | --- | --- | --- | | autoFocusButton | \u6307\u5B9A\u81EA\u52A8\u83B7\u5F97\u7126\u70B9\u7684\u6309\u94AE | null\\|string: \`ok\` \`cancel\` | \`ok\` | | | cancelText | \u53D6\u6D88\u6309\u94AE\u6587\u5B57 | () => VNode | \u53D6\u6D88 | | | centered | \u5782\u76F4\u5C45\u4E2D\u5C55\u793A Modal | Boolean | \`false\` | | | closable | \u662F\u5426\u663E\u793A\u53F3\u4E0A\u89D2\u7684\u5173\u95ED\u6309\u94AE | boolean | \`false\` | | | class | \u5BB9\u5668\u7C7B\u540D | string | - | | | content | \u5185\u5BB9 | () => VNode | \u65E0 | | | icon | \u81EA\u5B9A\u4E49\u56FE\u6807\uFF081.14.0 \u65B0\u589E\uFF09 | VNode \\| ()=>VNode | - | | | mask | \u662F\u5426\u5C55\u793A\u906E\u7F69 | Boolean | true | | | maskClosable | \u70B9\u51FB\u8499\u5C42\u662F\u5426\u5141\u8BB8\u5173\u95ED | Boolean | \`false\` | | | keyboard | \u662F\u5426\u652F\u6301\u952E\u76D8 esc \u5173\u95ED | boolean | true | | | okText | \u786E\u8BA4\u6309\u94AE\u6587\u5B57 | () => VNode | \u786E\u5B9A | | | okType | \u786E\u8BA4\u6309\u94AE\u7C7B\u578B | string | primary | | | okButtonProps | ok \u6309\u94AE props | [ButtonProps](/components/button) | - | | | cancelButtonProps | cancel \u6309\u94AE props | [ButtonProps](/components/button) | - | | | title | \u6807\u9898 | () => VNode | \u65E0 | | | width | \u5BBD\u5EA6 | string\\|number | 416 | | | zIndex | \u8BBE\u7F6E Modal \u7684 \`z-index\` | Number | 1000 | | | onCancel | \u53D6\u6D88\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u5173\u95ED\u51FD\u6570\uFF0C\u8FD4\u56DE promise \u65F6 resolve \u540E\u81EA\u52A8\u5173\u95ED | function | \u65E0 | | | onOk | \u70B9\u51FB\u786E\u5B9A\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u5173\u95ED\u51FD\u6570\uFF0C\u8FD4\u56DE promise \u65F6 resolve \u540E\u81EA\u52A8\u5173\u95ED | function | \u65E0 | | | appContext | \u5F39\u7A97\u7684\u7236\u7EA7\u4E0A\u4E0B\u6587\uFF0C\u4E00\u822C\u7528\u4E8E\u83B7\u53D6\u7236\u7EA7 provider\uFF0C \u5982\u83B7\u53D6 \`ConfigProvider\` \u7684\u914D\u7F6E | vue instance | - | | \u4EE5\u4E0A\u51FD\u6570\u8C03\u7528\u540E\uFF0C\u4F1A\u8FD4\u56DE\u4E00\u4E2A\u5F15\u7528\uFF0C\u53EF\u4EE5\u901A\u8FC7\u8BE5\u5F15\u7528\u66F4\u65B0\u548C\u5173\u95ED\u5F39\u7A97\u3002 \`\`\`jsx const modal = Modal.info(); modal.update({ title: '\u4FEE\u6539\u7684\u6807\u9898', content: '\u4FEE\u6539\u7684\u5185\u5BB9', }); modal.destroy(); \`\`\` - \`Modal.destroyAll\` \u4F7F\u7528 \`Modal.destroyAll()\` \u53EF\u4EE5\u9500\u6BC1\u5F39\u51FA\u7684\u786E\u8BA4\u7A97\uFF08\u5373\u4E0A\u8FF0\u7684 Modal.info\u3001Modal.success\u3001Modal.error\u3001Modal.warning\u3001Modal.confirm\uFF09\u3002\u901A\u5E38\u7528\u4E8E\u8DEF\u7531\u76D1\u542C\u5F53\u4E2D\uFF0C\u5904\u7406\u8DEF\u7531\u524D\u8FDB\u3001\u540E\u9000\u4E0D\u80FD\u9500\u6BC1\u786E\u8BA4\u5BF9\u8BDD\u6846\u7684\u95EE\u9898\uFF0C\u800C\u4E0D\u7528\u5404\u5904\u53BB\u4F7F\u7528\u5B9E\u4F8B\u7684\u8FD4\u56DE\u503C\u8FDB\u884C\u5173\u95ED\uFF08modal.destroy() \u9002\u7528\u4E8E\u4E3B\u52A8\u5173\u95ED\uFF0C\u800C\u4E0D\u662F\u8DEF\u7531\u8FD9\u6837\u88AB\u52A8\u5173\u95ED\uFF09 \`\`\`jsx const router = new VueRouter({ ... }) // router change router.beforeEach((to, from, next) => { Modal.destroyAll(); }) \`\`\` `,html:`

\u6A21\u6001\u5BF9\u8BDD\u6846\u3002

\u4F55\u65F6\u4F7F\u7528

\u9700\u8981\u7528\u6237\u5904\u7406\u4E8B\u52A1\uFF0C\u53C8\u4E0D\u5E0C\u671B\u8DF3\u8F6C\u9875\u9762\u4EE5\u81F4\u6253\u65AD\u5DE5\u4F5C\u6D41\u7A0B\u65F6\uFF0C\u53EF\u4EE5\u4F7F\u7528 Modal \u5728\u5F53\u524D\u9875\u9762\u6B63\u4E2D\u6253\u5F00\u4E00\u4E2A\u6D6E\u5C42\uFF0C\u627F\u8F7D\u76F8\u5E94\u7684\u64CD\u4F5C\u3002

\u53E6\u5916\u5F53\u9700\u8981\u4E00\u4E2A\u7B80\u6D01\u7684\u786E\u8BA4\u6846\u8BE2\u95EE\u7528\u6237\u65F6\uFF0C\u53EF\u4EE5\u4F7F\u7528 Modal.confirm() \u7B49\u8BED\u6CD5\u7CD6\u65B9\u6CD5\u3002

API

\u53C2\u6570 \u8BF4\u660E \u7C7B\u578B \u9ED8\u8BA4\u503C \u7248\u672C
afterClose Modal \u5B8C\u5168\u5173\u95ED\u540E\u7684\u56DE\u8C03 function \u65E0
bodyStyle Modal body \u6837\u5F0F object {}
cancelText \u53D6\u6D88\u6309\u94AE\u6587\u5B57 string| slot \u53D6\u6D88
centered \u5782\u76F4\u5C45\u4E2D\u5C55\u793A Modal Boolean false
closable \u662F\u5426\u663E\u793A\u53F3\u4E0A\u89D2\u7684\u5173\u95ED\u6309\u94AE boolean true
closeIcon \u81EA\u5B9A\u4E49\u5173\u95ED\u56FE\u6807 VNode | slot -
confirmLoading \u786E\u5B9A\u6309\u94AE loading boolean \u65E0
destroyOnClose \u5173\u95ED\u65F6\u9500\u6BC1 Modal \u91CC\u7684\u5B50\u5143\u7D20 boolean false
footer \u5E95\u90E8\u5185\u5BB9\uFF0C\u5F53\u4E0D\u9700\u8981\u9ED8\u8BA4\u5E95\u90E8\u6309\u94AE\u65F6\uFF0C\u53EF\u4EE5\u8BBE\u4E3A :footer="null" string|slot \u786E\u5B9A\u53D6\u6D88\u6309\u94AE
forceRender \u5F3A\u5236\u6E32\u67D3 Modal boolean false
getContainer \u6307\u5B9A Modal \u6302\u8F7D\u7684 HTML \u8282\u70B9 (instance): HTMLElement () => document.body
keyboard \u662F\u5426\u652F\u6301\u952E\u76D8 esc \u5173\u95ED boolean true
mask \u662F\u5426\u5C55\u793A\u906E\u7F69 Boolean true
maskClosable \u70B9\u51FB\u8499\u5C42\u662F\u5426\u5141\u8BB8\u5173\u95ED boolean true
maskStyle \u906E\u7F69\u6837\u5F0F object {}
okText \u786E\u8BA4\u6309\u94AE\u6587\u5B57 string|slot \u786E\u5B9A
okType \u786E\u8BA4\u6309\u94AE\u7C7B\u578B string primary
okButtonProps ok \u6309\u94AE props ButtonProps -
cancelButtonProps cancel \u6309\u94AE props ButtonProps -
title \u6807\u9898 string|slot \u65E0
visible(v-model) \u5BF9\u8BDD\u6846\u662F\u5426\u53EF\u89C1 boolean \u65E0
width \u5BBD\u5EA6 string|number 520
wrapClassName \u5BF9\u8BDD\u6846\u5916\u5C42\u5BB9\u5668\u7684\u7C7B\u540D string -
zIndex \u8BBE\u7F6E Modal \u7684 z-index Number 1000
dialogStyle \u53EF\u7528\u4E8E\u8BBE\u7F6E\u6D6E\u5C42\u7684\u6837\u5F0F\uFF0C\u8C03\u6574\u6D6E\u5C42\u4F4D\u7F6E\u7B49 object -
dialogClass \u53EF\u7528\u4E8E\u8BBE\u7F6E\u6D6E\u5C42\u7684\u7C7B\u540D string -

\u4E8B\u4EF6

\u4E8B\u4EF6\u540D\u79F0 \u8BF4\u660E \u56DE\u8C03\u53C2\u6570
cancel \u70B9\u51FB\u906E\u7F69\u5C42\u6216\u53F3\u4E0A\u89D2\u53C9\u6216\u53D6\u6D88\u6309\u94AE\u7684\u56DE\u8C03 function(e)
ok \u70B9\u51FB\u786E\u5B9A\u56DE\u8C03 function(e)

\u6CE8\u610F

<Modal /> \u9ED8\u8BA4\u5173\u95ED\u540E\u72B6\u6001\u4E0D\u4F1A\u81EA\u52A8\u6E05\u7A7A, \u5982\u679C\u5E0C\u671B\u6BCF\u6B21\u6253\u5F00\u90FD\u662F\u65B0\u5185\u5BB9\uFF0C\u8BF7\u8BBE\u7F6E destroyOnClose\u3002

\u5305\u62EC\uFF1A

\u4EE5\u4E0A\u5747\u4E3A\u4E00\u4E2A\u51FD\u6570\uFF0C\u53C2\u6570\u4E3A object\uFF0C\u5177\u4F53\u5C5E\u6027\u5982\u4E0B\uFF1A

\u53C2\u6570 \u8BF4\u660E \u7C7B\u578B \u9ED8\u8BA4\u503C \u7248\u672C
autoFocusButton \u6307\u5B9A\u81EA\u52A8\u83B7\u5F97\u7126\u70B9\u7684\u6309\u94AE null|string: ok cancel ok
cancelText \u53D6\u6D88\u6309\u94AE\u6587\u5B57 () => VNode \u53D6\u6D88
centered \u5782\u76F4\u5C45\u4E2D\u5C55\u793A Modal Boolean false
closable \u662F\u5426\u663E\u793A\u53F3\u4E0A\u89D2\u7684\u5173\u95ED\u6309\u94AE boolean false
class \u5BB9\u5668\u7C7B\u540D string -
content \u5185\u5BB9 () => VNode \u65E0
icon \u81EA\u5B9A\u4E49\u56FE\u6807\uFF081.14.0 \u65B0\u589E\uFF09 VNode | ()=>VNode -
mask \u662F\u5426\u5C55\u793A\u906E\u7F69 Boolean true
maskClosable \u70B9\u51FB\u8499\u5C42\u662F\u5426\u5141\u8BB8\u5173\u95ED Boolean false
keyboard \u662F\u5426\u652F\u6301\u952E\u76D8 esc \u5173\u95ED boolean true
okText \u786E\u8BA4\u6309\u94AE\u6587\u5B57 () => VNode \u786E\u5B9A
okType \u786E\u8BA4\u6309\u94AE\u7C7B\u578B string primary
okButtonProps ok \u6309\u94AE props ButtonProps -
cancelButtonProps cancel \u6309\u94AE props ButtonProps -
title \u6807\u9898 () => VNode \u65E0
width \u5BBD\u5EA6 string|number 416
zIndex \u8BBE\u7F6E Modal \u7684 z-index Number 1000
onCancel \u53D6\u6D88\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u5173\u95ED\u51FD\u6570\uFF0C\u8FD4\u56DE promise \u65F6 resolve \u540E\u81EA\u52A8\u5173\u95ED function \u65E0
onOk \u70B9\u51FB\u786E\u5B9A\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u5173\u95ED\u51FD\u6570\uFF0C\u8FD4\u56DE promise \u65F6 resolve \u540E\u81EA\u52A8\u5173\u95ED function \u65E0
appContext \u5F39\u7A97\u7684\u7236\u7EA7\u4E0A\u4E0B\u6587\uFF0C\u4E00\u822C\u7528\u4E8E\u83B7\u53D6\u7236\u7EA7 provider\uFF0C \u5982\u83B7\u53D6 ConfigProvider \u7684\u914D\u7F6E vue instance -

\u4EE5\u4E0A\u51FD\u6570\u8C03\u7528\u540E\uFF0C\u4F1A\u8FD4\u56DE\u4E00\u4E2A\u5F15\u7528\uFF0C\u53EF\u4EE5\u901A\u8FC7\u8BE5\u5F15\u7528\u66F4\u65B0\u548C\u5173\u95ED\u5F39\u7A97\u3002

const modal = Modal.info();

modal.update({
  title: '\u4FEE\u6539\u7684\u6807\u9898',
  content: '\u4FEE\u6539\u7684\u5185\u5BB9',
});

modal.destroy();

\u4F7F\u7528 Modal.destroyAll() \u53EF\u4EE5\u9500\u6BC1\u5F39\u51FA\u7684\u786E\u8BA4\u7A97\uFF08\u5373\u4E0A\u8FF0\u7684 Modal.info\u3001Modal.success\u3001Modal.error\u3001Modal.warning\u3001Modal.confirm\uFF09\u3002\u901A\u5E38\u7528\u4E8E\u8DEF\u7531\u76D1\u542C\u5F53\u4E2D\uFF0C\u5904\u7406\u8DEF\u7531\u524D\u8FDB\u3001\u540E\u9000\u4E0D\u80FD\u9500\u6BC1\u786E\u8BA4\u5BF9\u8BDD\u6846\u7684\u95EE\u9898\uFF0C\u800C\u4E0D\u7528\u5404\u5904\u53BB\u4F7F\u7528\u5B9E\u4F8B\u7684\u8FD4\u56DE\u503C\u8FDB\u884C\u5173\u95ED\uFF08modal.destroy() \u9002\u7528\u4E8E\u4E3B\u52A8\u5173\u95ED\uFF0C\u800C\u4E0D\u662F\u8DEF\u7531\u8FD9\u6837\u88AB\u52A8\u5173\u95ED\uFF09

const router = new VueRouter({ ... })

// router change
router.beforeEach((to, from, next) => {
  Modal.destroyAll();
})
`,lastUpdated:1748059052708}},yn={class:"markdown"};function Zn(a,s,l,u,d,I){return C(),w("article",yn,s[0]||(s[0]=[y(`

\u6A21\u6001\u5BF9\u8BDD\u6846\u3002

\u4F55\u65F6\u4F7F\u7528

\u9700\u8981\u7528\u6237\u5904\u7406\u4E8B\u52A1\uFF0C\u53C8\u4E0D\u5E0C\u671B\u8DF3\u8F6C\u9875\u9762\u4EE5\u81F4\u6253\u65AD\u5DE5\u4F5C\u6D41\u7A0B\u65F6\uFF0C\u53EF\u4EE5\u4F7F\u7528 Modal \u5728\u5F53\u524D\u9875\u9762\u6B63\u4E2D\u6253\u5F00\u4E00\u4E2A\u6D6E\u5C42\uFF0C\u627F\u8F7D\u76F8\u5E94\u7684\u64CD\u4F5C\u3002

\u53E6\u5916\u5F53\u9700\u8981\u4E00\u4E2A\u7B80\u6D01\u7684\u786E\u8BA4\u6846\u8BE2\u95EE\u7528\u6237\u65F6\uFF0C\u53EF\u4EE5\u4F7F\u7528 Modal.confirm() \u7B49\u8BED\u6CD5\u7CD6\u65B9\u6CD5\u3002

API

\u53C2\u6570\u8BF4\u660E\u7C7B\u578B\u9ED8\u8BA4\u503C\u7248\u672C
afterCloseModal \u5B8C\u5168\u5173\u95ED\u540E\u7684\u56DE\u8C03function\u65E0
bodyStyleModal body \u6837\u5F0Fobject{}
cancelText\u53D6\u6D88\u6309\u94AE\u6587\u5B57string| slot\u53D6\u6D88
centered\u5782\u76F4\u5C45\u4E2D\u5C55\u793A ModalBooleanfalse
closable\u662F\u5426\u663E\u793A\u53F3\u4E0A\u89D2\u7684\u5173\u95ED\u6309\u94AEbooleantrue
closeIcon\u81EA\u5B9A\u4E49\u5173\u95ED\u56FE\u6807VNode | slot-
confirmLoading\u786E\u5B9A\u6309\u94AE loadingboolean\u65E0
destroyOnClose\u5173\u95ED\u65F6\u9500\u6BC1 Modal \u91CC\u7684\u5B50\u5143\u7D20booleanfalse
footer\u5E95\u90E8\u5185\u5BB9\uFF0C\u5F53\u4E0D\u9700\u8981\u9ED8\u8BA4\u5E95\u90E8\u6309\u94AE\u65F6\uFF0C\u53EF\u4EE5\u8BBE\u4E3A :footer="null"string|slot\u786E\u5B9A\u53D6\u6D88\u6309\u94AE
forceRender\u5F3A\u5236\u6E32\u67D3 Modalbooleanfalse
getContainer\u6307\u5B9A Modal \u6302\u8F7D\u7684 HTML \u8282\u70B9(instance): HTMLElement() => document.body
keyboard\u662F\u5426\u652F\u6301\u952E\u76D8 esc \u5173\u95EDbooleantrue
mask\u662F\u5426\u5C55\u793A\u906E\u7F69Booleantrue
maskClosable\u70B9\u51FB\u8499\u5C42\u662F\u5426\u5141\u8BB8\u5173\u95EDbooleantrue
maskStyle\u906E\u7F69\u6837\u5F0Fobject{}
okText\u786E\u8BA4\u6309\u94AE\u6587\u5B57string|slot\u786E\u5B9A
okType\u786E\u8BA4\u6309\u94AE\u7C7B\u578Bstringprimary
okButtonPropsok \u6309\u94AE propsButtonProps-
cancelButtonPropscancel \u6309\u94AE propsButtonProps-
title\u6807\u9898string|slot\u65E0
visible(v-model)\u5BF9\u8BDD\u6846\u662F\u5426\u53EF\u89C1boolean\u65E0
width\u5BBD\u5EA6string|number520
wrapClassName\u5BF9\u8BDD\u6846\u5916\u5C42\u5BB9\u5668\u7684\u7C7B\u540Dstring-
zIndex\u8BBE\u7F6E Modal \u7684 z-indexNumber1000
dialogStyle\u53EF\u7528\u4E8E\u8BBE\u7F6E\u6D6E\u5C42\u7684\u6837\u5F0F\uFF0C\u8C03\u6574\u6D6E\u5C42\u4F4D\u7F6E\u7B49object-
dialogClass\u53EF\u7528\u4E8E\u8BBE\u7F6E\u6D6E\u5C42\u7684\u7C7B\u540Dstring-

\u4E8B\u4EF6

\u4E8B\u4EF6\u540D\u79F0\u8BF4\u660E\u56DE\u8C03\u53C2\u6570
cancel\u70B9\u51FB\u906E\u7F69\u5C42\u6216\u53F3\u4E0A\u89D2\u53C9\u6216\u53D6\u6D88\u6309\u94AE\u7684\u56DE\u8C03function(e)
ok\u70B9\u51FB\u786E\u5B9A\u56DE\u8C03function(e)

\u6CE8\u610F

<Modal /> \u9ED8\u8BA4\u5173\u95ED\u540E\u72B6\u6001\u4E0D\u4F1A\u81EA\u52A8\u6E05\u7A7A, \u5982\u679C\u5E0C\u671B\u6BCF\u6B21\u6253\u5F00\u90FD\u662F\u65B0\u5185\u5BB9\uFF0C\u8BF7\u8BBE\u7F6E destroyOnClose\u3002

\u5305\u62EC\uFF1A

\u4EE5\u4E0A\u5747\u4E3A\u4E00\u4E2A\u51FD\u6570\uFF0C\u53C2\u6570\u4E3A object\uFF0C\u5177\u4F53\u5C5E\u6027\u5982\u4E0B\uFF1A

\u53C2\u6570\u8BF4\u660E\u7C7B\u578B\u9ED8\u8BA4\u503C\u7248\u672C
autoFocusButton\u6307\u5B9A\u81EA\u52A8\u83B7\u5F97\u7126\u70B9\u7684\u6309\u94AEnull|string: ok cancelok
cancelText\u53D6\u6D88\u6309\u94AE\u6587\u5B57() => VNode\u53D6\u6D88
centered\u5782\u76F4\u5C45\u4E2D\u5C55\u793A ModalBooleanfalse
closable\u662F\u5426\u663E\u793A\u53F3\u4E0A\u89D2\u7684\u5173\u95ED\u6309\u94AEbooleanfalse
class\u5BB9\u5668\u7C7B\u540Dstring-
content\u5185\u5BB9() => VNode\u65E0
icon\u81EA\u5B9A\u4E49\u56FE\u6807\uFF081.14.0 \u65B0\u589E\uFF09VNode | ()=>VNode-
mask\u662F\u5426\u5C55\u793A\u906E\u7F69Booleantrue
maskClosable\u70B9\u51FB\u8499\u5C42\u662F\u5426\u5141\u8BB8\u5173\u95EDBooleanfalse
keyboard\u662F\u5426\u652F\u6301\u952E\u76D8 esc \u5173\u95EDbooleantrue
okText\u786E\u8BA4\u6309\u94AE\u6587\u5B57() => VNode\u786E\u5B9A
okType\u786E\u8BA4\u6309\u94AE\u7C7B\u578Bstringprimary
okButtonPropsok \u6309\u94AE propsButtonProps-
cancelButtonPropscancel \u6309\u94AE propsButtonProps-
title\u6807\u9898() => VNode\u65E0
width\u5BBD\u5EA6string|number416
zIndex\u8BBE\u7F6E Modal \u7684 z-indexNumber1000
onCancel\u53D6\u6D88\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u5173\u95ED\u51FD\u6570\uFF0C\u8FD4\u56DE promise \u65F6 resolve \u540E\u81EA\u52A8\u5173\u95EDfunction\u65E0
onOk\u70B9\u51FB\u786E\u5B9A\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u5173\u95ED\u51FD\u6570\uFF0C\u8FD4\u56DE promise \u65F6 resolve \u540E\u81EA\u52A8\u5173\u95EDfunction\u65E0
appContext\u5F39\u7A97\u7684\u7236\u7EA7\u4E0A\u4E0B\u6587\uFF0C\u4E00\u822C\u7528\u4E8E\u83B7\u53D6\u7236\u7EA7 provider\uFF0C \u5982\u83B7\u53D6 ConfigProvider \u7684\u914D\u7F6Evue instance-

\u4EE5\u4E0A\u51FD\u6570\u8C03\u7528\u540E\uFF0C\u4F1A\u8FD4\u56DE\u4E00\u4E2A\u5F15\u7528\uFF0C\u53EF\u4EE5\u901A\u8FC7\u8BE5\u5F15\u7528\u66F4\u65B0\u548C\u5173\u95ED\u5F39\u7A97\u3002

const modal = Modal.info();

modal.update({
  title: '\u4FEE\u6539\u7684\u6807\u9898',
  content: '\u4FEE\u6539\u7684\u5185\u5BB9',
});

modal.destroy();

\u4F7F\u7528 Modal.destroyAll() \u53EF\u4EE5\u9500\u6BC1\u5F39\u51FA\u7684\u786E\u8BA4\u7A97\uFF08\u5373\u4E0A\u8FF0\u7684 Modal.info\u3001Modal.success\u3001Modal.error\u3001Modal.warning\u3001Modal.confirm\uFF09\u3002\u901A\u5E38\u7528\u4E8E\u8DEF\u7531\u76D1\u542C\u5F53\u4E2D\uFF0C\u5904\u7406\u8DEF\u7531\u524D\u8FDB\u3001\u540E\u9000\u4E0D\u80FD\u9500\u6BC1\u786E\u8BA4\u5BF9\u8BDD\u6846\u7684\u95EE\u9898\uFF0C\u800C\u4E0D\u7528\u5404\u5904\u53BB\u4F7F\u7528\u5B9E\u4F8B\u7684\u8FD4\u56DE\u503C\u8FDB\u884C\u5173\u95ED\uFF08modal.destroy() \u9002\u7528\u4E8E\u4E3B\u52A8\u5173\u95ED\uFF0C\u800C\u4E0D\u662F\u8DEF\u7531\u8FD9\u6837\u88AB\u52A8\u5173\u95ED\uFF09

const router = new VueRouter({ ... })

// router change
router.beforeEach((to, from, next) => {
  Modal.destroyAll();
})
`,20)]))}var Bn=g(wn,[["render",Zn]]);const Gn={pageData:{title:"Modal",description:"",frontmatter:{category:"Components",type:"Feedback",title:"Modal",cover:"https://gw.alipayobjects.com/zos/alicdn/3StSdUlSH/Modal.svg"},headers:[{level:2,title:"When To Use",slug:"when-to-use",content:"When requiring users to interact with the application, but without jumping to a new page and interrupting\nthe user's workflow, you can use `Modal` to create a new floating layer over the current page to get user\nfeedback or display information.\nAdditionally, if you need show a simple confirmation dialog, you can use `antd.Modal.confirm()`,\nand so on."},{level:2,title:"API",slug:"api",content:""},{level:3,title:"events",slug:"events",content:""},{level:3,title:"Modal.method()",slug:"modal-method",content:"There are five ways to display the information based on the content's nature:"}],relativePath:"src/docs/modal/index.en-US.md",content:` Modal dialogs. ## When To Use When requiring users to interact with the application, but without jumping to a new page and interrupting the user's workflow, you can use \`Modal\` to create a new floating layer over the current page to get user feedback or display information. Additionally, if you need show a simple confirmation dialog, you can use \`antd.Modal.confirm()\`, and so on. ## API | Property | Description | Type | Default | Version | | --- | --- | --- | --- | --- | | afterClose | Specify a function that will be called when modal is closed completely. | function | - | | | bodyStyle | Body style for modal body element. Such as height, padding etc. | object | {} | | | cancelText | Text of the Cancel button | string\\|slot | \`Cancel\` | | | centered | Centered Modal | Boolean | \`false\` | | | closable | Whether a close (x) button is visible on top right of the modal dialog or not | boolean | true | | | closeIcon | custom close icon | VNode \\| slot | - | | | confirmLoading | Whether to apply loading visual effect for OK button or not | boolean | false | | | destroyOnClose | Whether to unmount child components on onClose | boolean | false | | | footer | Footer content, set as \`:footer="null"\` when you don't need default buttons | string\\|slot | OK and Cancel buttons | | | forceRender | Force render Modal | boolean | false | | | getContainer | Return the mount node for Modal | (instance): HTMLElement | () => document.body | | | mask | Whether show mask or not. | Boolean | true | | | maskClosable | Whether to close the modal dialog when the mask (area outside the modal) is clicked | boolean | true | | | maskStyle | Style for modal's mask element. | object | {} | | | okText | Text of the OK button | string\\|slot | \`OK\` | | | okType | Button \`type\` of the OK button | string | \`primary\` | | | okButtonProps | The ok button props | [ButtonProps](/components/button/#API) | - | | | cancelButtonProps | The cancel button props | [ButtonProps](/components/button/#API) | - | | | title | The modal dialog's title | string\\|slot | - | | | visible | Whether the modal dialog is visible or not | boolean | false | | | width | Width of the modal dialog | string\\|number | 520 | | | wrapClassName | The class name of the container of the modal dialog | string | - | | | zIndex | The \`z-index\` of the Modal | Number | 1000 | | | dialogStyle | Style of floating layer, typically used at least for adjusting the position. | object | - | | | dialogClass | className of floating layer. | string | - | | ### events | Events Name | Description | Arguments | | --- | --- | --- | | cancel | Specify a function that will be called when a user clicks mask, close button on top right or Cancel button | function(e) | | ok | Specify a function that will be called when a user clicks the OK button | function(e) | #### Note > The state of Modal will be preserved at it's component lifecycle by default, if you wish to open it with a brand new state everytime, set \`destroyOnClose\` on it. ### Modal.method() There are five ways to display the information based on the content's nature: - \`Modal.info\` - \`Modal.success\` - \`Modal.error\` - \`Modal.warning\` - \`Modal.confirm\` The items listed above are all functions, expecting a settings object as parameter. The properties of the object are follows: | Property | Description | Type | Default | Version | | --- | --- | --- | --- | --- | | autoFocusButton | Specify which button to autofocus | null\\|string: \`ok\` \`cancel\` | \`ok\` | | | cancelText | Text of the Cancel button | () => VNode | \`Cancel\` | | | centered | Centered Modal | Boolean | \`false\` | | | closable | Whether a close (x) button is visible on top right of the modal dialog or not | boolean | \`false\` | | | class | class of container | string | - | | | content | Content | () => VNode | - | | | icon | custom icon (\`Added in 1.14.0\`) | () => VNode | - | | | keyboard | Whether support press esc to close | Boolean | true | | | mask | Whether show mask or not. | Boolean | true | | | maskClosable | Whether to close the modal dialog when the mask (area outside the modal) is clicked | Boolean | \`false\` | | | okText | Text of the OK button | () => VNode | \`OK\` | | | okType | Button \`type\` of the OK button | string | \`primary\` | | | okButtonProps | The ok button props | [ButtonProps](/components/button) | - | | | cancelButtonProps | The cancel button props | [ButtonProps](/components/button) | - | | | title | Title | () => VNode | - | | | width | Width of the modal dialog | string\\|number | 416 | | | zIndex | The \`z-index\` of the Modal | Number | 1000 | | | onCancel | Specify a function that will be called when the user clicks the Cancel button. The parameter of this function is a function whose execution should include closing the dialog. You can also just return a promise and when the promise is resolved, the modal dialog will also be closed | function | - | | | onOk | Specify a function that will be called when the user clicks the OK button. The parameter of this function is a function whose execution should include closing the dialog. You can also just return a promise and when the promise is resolved, the modal dialog will also be closed | function | - | | | appContext | The appContext of the popup is generally used to get the parent provider, such as the configuration of \`ConfigProvider\` | vue instance | - | | All the \`Modal.method\`s will return a reference, and then we can update and close the modal dialog by the reference. \`\`\`jsx const modal = Modal.info(); modal.update({ title: 'Updated title', content: 'Updated content', }); modal.destroy(); \`\`\` - \`Modal.destroyAll\` \`Modal.destroyAll()\` could destroy all confirmation modal dialogs(Modal.info/Modal.success/Modal.error/Modal.warning/Modal.confirm). Usually, you can use it in router change event to destroy confirm modal dialog automatically without use modal reference to close( it's too complex to use for all modal dialogs) \`\`\`jsx const router = new VueRouter({ ... }) // router change router.beforeEach((to, from, next) => { Modal.destroyAll(); }) \`\`\` `,html:`

Modal dialogs.

When To Use

When requiring users to interact with the application, but without jumping to a new page and interrupting the user's workflow, you can use Modal to create a new floating layer over the current page to get user feedback or display information. Additionally, if you need show a simple confirmation dialog, you can use antd.Modal.confirm(), and so on.

API

Property Description Type Default Version
afterClose Specify a function that will be called when modal is closed completely. function -
bodyStyle Body style for modal body element. Such as height, padding etc. object {}
cancelText Text of the Cancel button string|slot Cancel
centered Centered Modal Boolean false
closable Whether a close (x) button is visible on top right of the modal dialog or not boolean true
closeIcon custom close icon VNode | slot -
confirmLoading Whether to apply loading visual effect for OK button or not boolean false
destroyOnClose Whether to unmount child components on onClose boolean false
footer Footer content, set as :footer="null" when you don't need default buttons string|slot OK and Cancel buttons
forceRender Force render Modal boolean false
getContainer Return the mount node for Modal (instance): HTMLElement () => document.body
mask Whether show mask or not. Boolean true
maskClosable Whether to close the modal dialog when the mask (area outside the modal) is clicked boolean true
maskStyle Style for modal's mask element. object {}
okText Text of the OK button string|slot OK
okType Button type of the OK button string primary
okButtonProps The ok button props ButtonProps -
cancelButtonProps The cancel button props ButtonProps -
title The modal dialog's title string|slot -
visible Whether the modal dialog is visible or not boolean false
width Width of the modal dialog string|number 520
wrapClassName The class name of the container of the modal dialog string -
zIndex The z-index of the Modal Number 1000
dialogStyle Style of floating layer, typically used at least for adjusting the position. object -
dialogClass className of floating layer. string -

events

Events Name Description Arguments
cancel Specify a function that will be called when a user clicks mask, close button on top right or Cancel button function(e)
ok Specify a function that will be called when a user clicks the OK button function(e)

Note

The state of Modal will be preserved at it's component lifecycle by default, if you wish to open it with a brand new state everytime, set destroyOnClose on it.

There are five ways to display the information based on the content's nature:

The items listed above are all functions, expecting a settings object as parameter. The properties of the object are follows:

Property Description Type Default Version
autoFocusButton Specify which button to autofocus null|string: ok cancel ok
cancelText Text of the Cancel button () => VNode Cancel
centered Centered Modal Boolean false
closable Whether a close (x) button is visible on top right of the modal dialog or not boolean false
class class of container string -
content Content () => VNode -
icon custom icon (Added in 1.14.0) () => VNode -
keyboard Whether support press esc to close Boolean true
mask Whether show mask or not. Boolean true
maskClosable Whether to close the modal dialog when the mask (area outside the modal) is clicked Boolean false
okText Text of the OK button () => VNode OK
okType Button type of the OK button string primary
okButtonProps The ok button props ButtonProps -
cancelButtonProps The cancel button props ButtonProps -
title Title () => VNode -
width Width of the modal dialog string|number 416
zIndex The z-index of the Modal Number 1000
onCancel Specify a function that will be called when the user clicks the Cancel button. The parameter of this function is a function whose execution should include closing the dialog. You can also just return a promise and when the promise is resolved, the modal dialog will also be closed function -
onOk Specify a function that will be called when the user clicks the OK button. The parameter of this function is a function whose execution should include closing the dialog. You can also just return a promise and when the promise is resolved, the modal dialog will also be closed function -
appContext The appContext of the popup is generally used to get the parent provider, such as the configuration of ConfigProvider vue instance -

All the Modal.methods will return a reference, and then we can update and close the modal dialog by the reference.

const modal = Modal.info();

modal.update({
  title: 'Updated title',
  content: 'Updated content',
});

modal.destroy();

Modal.destroyAll() could destroy all confirmation modal dialogs(Modal.info/Modal.success/Modal.error/Modal.warning/Modal.confirm). Usually, you can use it in router change event to destroy confirm modal dialog automatically without use modal reference to close( it's too complex to use for all modal dialogs)

const router = new VueRouter({ ... })

// router change
router.beforeEach((to, from, next) => {
  Modal.destroyAll();
})
`,lastUpdated:1748059052708}},Wn={class:"markdown"};function Yn(a,s,l,u,d,I){return C(),w("article",Wn,s[0]||(s[0]=[y(`

Modal dialogs.

When To Use

When requiring users to interact with the application, but without jumping to a new page and interrupting the user's workflow, you can use Modal to create a new floating layer over the current page to get user feedback or display information. Additionally, if you need show a simple confirmation dialog, you can use antd.Modal.confirm(), and so on.

API

PropertyDescriptionTypeDefaultVersion
afterCloseSpecify a function that will be called when modal is closed completely.function-
bodyStyleBody style for modal body element. Such as height, padding etc.object{}
cancelTextText of the Cancel buttonstring|slotCancel
centeredCentered ModalBooleanfalse
closableWhether a close (x) button is visible on top right of the modal dialog or notbooleantrue
closeIconcustom close iconVNode | slot-
confirmLoadingWhether to apply loading visual effect for OK button or notbooleanfalse
destroyOnCloseWhether to unmount child components on onClosebooleanfalse
footerFooter content, set as :footer="null" when you don't need default buttonsstring|slotOK and Cancel buttons
forceRenderForce render Modalbooleanfalse
getContainerReturn the mount node for Modal(instance): HTMLElement() => document.body
maskWhether show mask or not.Booleantrue
maskClosableWhether to close the modal dialog when the mask (area outside the modal) is clickedbooleantrue
maskStyleStyle for modal's mask element.object{}
okTextText of the OK buttonstring|slotOK
okTypeButton type of the OK buttonstringprimary
okButtonPropsThe ok button propsButtonProps-
cancelButtonPropsThe cancel button propsButtonProps-
titleThe modal dialog's titlestring|slot-
visibleWhether the modal dialog is visible or notbooleanfalse
widthWidth of the modal dialogstring|number520
wrapClassNameThe class name of the container of the modal dialogstring-
zIndexThe z-index of the ModalNumber1000
dialogStyleStyle of floating layer, typically used at least for adjusting the position.object-
dialogClassclassName of floating layer.string-

events

Events NameDescriptionArguments
cancelSpecify a function that will be called when a user clicks mask, close button on top right or Cancel buttonfunction(e)
okSpecify a function that will be called when a user clicks the OK buttonfunction(e)

Note

The state of Modal will be preserved at it's component lifecycle by default, if you wish to open it with a brand new state everytime, set destroyOnClose on it.

There are five ways to display the information based on the content's nature:

The items listed above are all functions, expecting a settings object as parameter. The properties of the object are follows:

PropertyDescriptionTypeDefaultVersion
autoFocusButtonSpecify which button to autofocusnull|string: ok cancelok
cancelTextText of the Cancel button() => VNodeCancel
centeredCentered ModalBooleanfalse
closableWhether a close (x) button is visible on top right of the modal dialog or notbooleanfalse
classclass of containerstring-
contentContent() => VNode-
iconcustom icon (Added in 1.14.0)() => VNode-
keyboardWhether support press esc to closeBooleantrue
maskWhether show mask or not.Booleantrue
maskClosableWhether to close the modal dialog when the mask (area outside the modal) is clickedBooleanfalse
okTextText of the OK button() => VNodeOK
okTypeButton type of the OK buttonstringprimary
okButtonPropsThe ok button propsButtonProps-
cancelButtonPropsThe cancel button propsButtonProps-
titleTitle() => VNode-
widthWidth of the modal dialogstring|number416
zIndexThe z-index of the ModalNumber1000
onCancelSpecify a function that will be called when the user clicks the Cancel button. The parameter of this function is a function whose execution should include closing the dialog. You can also just return a promise and when the promise is resolved, the modal dialog will also be closedfunction-
onOkSpecify a function that will be called when the user clicks the OK button. The parameter of this function is a function whose execution should include closing the dialog. You can also just return a promise and when the promise is resolved, the modal dialog will also be closedfunction-
appContextThe appContext of the popup is generally used to get the parent provider, such as the configuration of ConfigProvidervue instance-

All the Modal.methods will return a reference, and then we can update and close the modal dialog by the reference.

const modal = Modal.info();

modal.update({
  title: 'Updated title',
  content: 'Updated content',
});

modal.destroy();

Modal.destroyAll() could destroy all confirmation modal dialogs(Modal.info/Modal.success/Modal.error/Modal.warning/Modal.confirm). Usually, you can use it in router change event to destroy confirm modal dialog automatically without use modal reference to close( it's too complex to use for all modal dialogs)

const router = new VueRouter({ ... })

// router change
router.beforeEach((to, from, next) => {
  Modal.destroyAll();
})
`,19)]))}var Nn=g(Gn,[["render",Yn]]);const Sn=b({CN:Bn,US:Nn,components:{Basic:T,Async:F,CustomFooter:z,Confirm:O,Info:Q,Locale:$,Manual:sn,Position:cn,ConfirmRouter:un,ConfirmPromise:rn,Width:In,ButtonProps:vn,Fullscreen:An},setup(){return{}}});function Pn(a,s,l,u,d,I){const p=c("basic"),i=c("async"),r=c("custom-footer"),k=c("confirm"),Z=c("info"),B=c("locale"),G=c("manual"),W=c("position"),Y=c("confirm-router"),N=c("confirm-promise"),S=c("width"),P=c("button-props"),V=c("fullscreen"),H=c("demo-sort");return C(),m(H,null,{default:o(()=>[e(p),e(i),e(r),e(k),e(Z),e(B),e(G),e(W),e(Y),e(N),e(S),e(P),e(V)]),_:1})}var Hn=g(Sn,[["render",Pn]]);export{Hn as default};