github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
ant-design-vue/6359acc4.async.js

1 line
68 KiB
JavaScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

(window.webpackJsonp=window.webpackJsonp||[]).push([[25],{1215:function(s,t,a){},1311:function(s,t,a){"use strict";var n=a(1215);a.n(n).a},1458:function(s,t,a){"use strict";a.r(t);var n=function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-popconfirm title="Are you sure delete this task?" @confirm="confirm" @cancel="cancel" okText="Yes" cancelText="No">\n <a href="#">Delete</a>\n </a-popconfirm>\n',script:"\n export default {\n methods: {\n confirm(e) {\n console.log(e);\n this.$message.success('Click on Yes');\n },\n cancel(e) {\n console.log(e);\n this.$message.error('Click on No');\n },\n },\n };\n",style:null,us:"\n#### Basic\nThe basic example.\n",cn:"\n#### 基本\n最简单的用法。\n",sourceCode:'<template>\n <a-popconfirm\n title="Are you sure delete this task?"\n @confirm="confirm"\n @cancel="cancel"\n okText="Yes"\n cancelText="No"\n >\n <a href="#">Delete</a>\n </a-popconfirm>\n</template>\n<script>\n export default {\n methods: {\n confirm(e) {\n console.log(e);\n this.$message.success(\'Click on Yes\');\n },\n cancel(e) {\n console.log(e);\n this.$message.error(\'Click on No\');\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-popconfirm",{attrs:{title:"Are you sure delete this task?",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm,cancel:s.cancel}},[a("a",{attrs:{href:"#"}},[s._v("Delete")])])],1),s._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"基本"}},[s._v("基本 "),a("a",{staticClass:"anchor",attrs:{href:"#基本"}},[s._v("#")])]),s._v(" "),a("p",[s._v("最简单的用法。")])]),s._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Basic"}},[s._v("Basic "),a("a",{staticClass:"anchor",attrs:{href:"#Basic"}},[s._v("#")])]),s._v(" "),a("p",[s._v("The basic example.")])]),s._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v("title")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Are you sure delete this task?"')]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v("@cancel")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"cancel"')]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v("\n >")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"#"')]),s._v(">")]),s._v("Delete"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),a("span",{staticClass:"javascript"},[s._v("\n "),a("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),a("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n "),a("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n confirm(e) {\n "),a("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(e);\n "),a("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".$message.success("),a("span",{staticClass:"hljs-string"},[s._v("'Click on Yes'")]),s._v(");\n },\n cancel(e) {\n "),a("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(e);\n "),a("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".$message.error("),a("span",{staticClass:"hljs-string"},[s._v("'Click on No'")]),s._v(");\n },\n },\n };\n")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};n._withStripped=!0;var e={methods:{confirm:function(s){console.log(s),this.$message.success("Click on Yes")},cancel:function(s){console.log(s),this.$message.error("Click on No")}}},l=a(31),i=Object(l.a)(e,n,[],!1,null,null,null);i.options.__file="components/popconfirm/demo/basic.md";var v=i.exports,_=function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-popconfirm title="Are you sure？" okText="Yes" cancelText="No">\n <a href="#">Delete</a>\n </a-popconfirm>\n',script:null,style:null,us:"\n#### Locale text\nSet `okText` and `cancelText` props to customize the button's labels.\n",cn:"\n#### 国际化\n使用 `okText` 和 `cancelText` 自定义按钮文字。\n",sourceCode:'<template>\n <a-popconfirm title="Are you sure？" okText="Yes" cancelText="No">\n <a href="#">Delete</a>\n </a-popconfirm>\n</template>\n'}}},[a("template",{slot:"component"},[a("a-popconfirm",{attrs:{title:"Are you sure？",okText:"Yes",cancelText:"No"}},[a("a",{attrs:{href:"#"}},[s._v("Delete")])])],1),s._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"国际化"}},[s._v("国际化 "),a("a",{staticClass:"anchor",attrs:{href:"#国际化"}},[s._v("#")])]),s._v(" "),a("p",[s._v("使用 "),a("code",[s._v("okText")]),s._v(" 和 "),a("code",[s._v("cancelText")]),s._v(" 自定义按钮文字。")])]),s._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Locale-text"}},[s._v("Locale text "),a("a",{staticClass:"anchor",attrs:{href:"#Locale-text"}},[s._v("#")])]),s._v(" "),a("p",[s._v("Set "),a("code",[s._v("okText")]),s._v(" and "),a("code",[s._v("cancelText")]),s._v(" props to customize the button's labels.")])]),s._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("title")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Are you sure？"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"#"')]),s._v(">")]),s._v("Delete"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n")])])])],2)]],2)};_._withStripped=!0;var c=Object(l.a)({},_,[],!1,null,null,null);c.options.__file="components/popconfirm/demo/local.md";var p=c.exports,o=function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <div id="components-a-popconfirm-demo-placement">\n <div :style="{ marginLeft: `${buttonWidth}px`, whiteSpace: \'nowrap\' }">\n <a-popconfirm placement="topLeft" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>TL</a-button>\n </a-popconfirm>\n <a-popconfirm placement="top" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>Top</a-button>\n </a-popconfirm>\n <a-popconfirm placement="topRight" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>TR</a-button>\n </a-popconfirm>\n </div>\n <div :style="{ width: `${buttonWidth}px`, float: \'left\' }">\n <a-popconfirm placement="leftTop" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>LT</a-button>\n </a-popconfirm>\n <a-popconfirm placement="left" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>Left</a-button>\n </a-popconfirm>\n <a-popconfirm placement="leftBottom" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>LB</a-button>\n </a-popconfirm>\n </div>\n <div :style="{ width: `${buttonWidth}px`, marginLeft: `${buttonWidth * 4 + 24 }px`}">\n <a-popconfirm placement="rightTop" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>RT</a-button>\n </a-popconfirm>\n <a-popconfirm placement="right" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>Right</a-button>\n </a-popconfirm>\n <a-popconfirm placement="rightBottom" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>RB</a-button>\n </a-popconfirm>\n </div>\n <div :style="{ marginLeft: `${buttonWidth}px`, clear: \'both\', whiteSpace: \'nowrap\' }">\n <a-popconfirm placement="bottomLeft" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>BL</a-button>\n </a-popconfirm>\n <a-popconfirm placement="bottom" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>Bottom</a-button>\n </a-popconfirm>\n <a-popconfirm placement="bottomRight" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>BR</a-button>\n </a-popconfirm>\n </div>\n </div>\n',script:"\n import { message } from 'ant-design-vue';\n\n export default {\n data() {\n return {\n buttonWidth: 70,\n text: 'Are you sure to delete this task?',\n };\n },\n methods: {\n confirm() {\n message.info('Clicked on Yes.');\n },\n },\n };\n",style:null,us:"\n#### Placement\nThere are 12 `placement` options available. Use `arrowPointAtCenter` if you want arrow point at the center of target.\n",cn:"\n#### 位置\n位置有十二个方向。如需箭头指向目标元素中心，可以设置 `arrowPointAtCenter`。\n",sourceCode:'<template>\n <div id="components-a-popconfirm-demo-placement">\n <div :style="{ marginLeft: `${buttonWidth}px`, whiteSpace: \'nowrap\' }">\n <a-popconfirm placement="topLeft" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>TL</a-button>\n </a-popconfirm>\n <a-popconfirm placement="top" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>Top</a-button>\n </a-popconfirm>\n <a-popconfirm placement="topRight" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>TR</a-button>\n </a-popconfirm>\n </div>\n <div :style="{ width: `${buttonWidth}px`, float: \'left\' }">\n <a-popconfirm placement="leftTop" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>LT</a-button>\n </a-popconfirm>\n <a-popconfirm placement="left" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>Left</a-button>\n </a-popconfirm>\n <a-popconfirm placement="leftBottom" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>LB</a-button>\n </a-popconfirm>\n </div>\n <div :style="{ width: `${buttonWidth}px`, marginLeft: `${buttonWidth * 4 + 24 }px`}">\n <a-popconfirm placement="rightTop" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>RT</a-button>\n </a-popconfirm>\n <a-popconfirm placement="right" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>Right</a-button>\n </a-popconfirm>\n <a-popconfirm placement="rightBottom" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>RB</a-button>\n </a-popconfirm>\n </div>\n <div :style="{ marginLeft: `${buttonWidth}px`, clear: \'both\', whiteSpace: \'nowrap\' }">\n <a-popconfirm placement="bottomLeft" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>BL</a-button>\n </a-popconfirm>\n <a-popconfirm placement="bottom" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>Bottom</a-button>\n </a-popconfirm>\n <a-popconfirm placement="bottomRight" okText="Yes" cancelText="No" @confirm="confirm">\n <template slot="title">\n <p>{{text}}</p>\n <p>{{text}}</p>\n </template>\n <a-button>BR</a-button>\n </a-popconfirm>\n </div>\n </div>\n</template>\n<script>\n import { message } from \'ant-design-vue\';\n\n export default {\n data() {\n return {\n buttonWidth: 70,\n text: \'Are you sure to delete this task?\',\n };\n },\n methods: {\n confirm() {\n message.info(\'Clicked on Yes.\');\n },\n },\n };\n<\/script>\n<style scoped>\n #components-a-popconfirm-demo-placement .ant-btn {\n width: 70px;\n text-align: center;\n padding: 0;\n margin-right: 8px;\n margin-bottom: 8px;\n }\n</style>\n'}}},[a("template",{slot:"component"},[a("div",{attrs:{id:"components-a-popconfirm-demo-placement"}},[a("div",{style:{marginLeft:s.buttonWidth+"px",whiteSpace:"nowrap"}},[a("a-popconfirm",{attrs:{placement:"topLeft",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("TL")])],2),s._v(" "),a("a-popconfirm",{attrs:{placement:"top",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("Top")])],2),s._v(" "),a("a-popconfirm",{attrs:{placement:"topRight",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("TR")])],2)],1),s._v(" "),a("div",{style:{width:s.buttonWidth+"px",float:"left"}},[a("a-popconfirm",{attrs:{placement:"leftTop",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("LT")])],2),s._v(" "),a("a-popconfirm",{attrs:{placement:"left",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("Left")])],2),s._v(" "),a("a-popconfirm",{attrs:{placement:"leftBottom",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("LB")])],2)],1),s._v(" "),a("div",{style:{width:s.buttonWidth+"px",marginLeft:4*s.buttonWidth+24+"px"}},[a("a-popconfirm",{attrs:{placement:"rightTop",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("RT")])],2),s._v(" "),a("a-popconfirm",{attrs:{placement:"right",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("Right")])],2),s._v(" "),a("a-popconfirm",{attrs:{placement:"rightBottom",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("RB")])],2)],1),s._v(" "),a("div",{style:{marginLeft:s.buttonWidth+"px",clear:"both",whiteSpace:"nowrap"}},[a("a-popconfirm",{attrs:{placement:"bottomLeft",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("BL")])],2),s._v(" "),a("a-popconfirm",{attrs:{placement:"bottom",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("Bottom")])],2),s._v(" "),a("a-popconfirm",{attrs:{placement:"bottomRight",okText:"Yes",cancelText:"No"},on:{confirm:s.confirm}},[a("template",{slot:"title"},[a("p",[s._v(s._s(s.text))]),s._v(" "),a("p",[s._v(s._s(s.text))])]),s._v(" "),a("a-button",[s._v("BR")])],2)],1)])]),s._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"位置"}},[s._v("位置 "),a("a",{staticClass:"anchor",attrs:{href:"#位置"}},[s._v("#")])]),s._v(" "),a("p",[s._v("位置有十二个方向。如需箭头指向目标元素中心，可以设置 "),a("code",[s._v("arrowPointAtCenter")]),s._v("。")])]),s._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Placement"}},[s._v("Placement "),a("a",{staticClass:"anchor",attrs:{href:"#Placement"}},[s._v("#")])]),s._v(" "),a("p",[s._v("There are 12 "),a("code",[s._v("placement")]),s._v(" options available. Use "),a("code",[s._v("arrowPointAtCenter")]),s._v(" if you want arrow point at the center of target.")])]),s._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("id")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"components-a-popconfirm-demo-placement"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v(":style")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v("\"{ marginLeft: `${buttonWidth}px`, whiteSpace: 'nowrap' }\"")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"topLeft"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("TL"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"top"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("Top"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"topRight"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("TR"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v(":style")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v("\"{ width: `${buttonWidth}px`, float: 'left' }\"")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"leftTop"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("LT"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"left"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("Left"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"leftBottom"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("LB"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v(":style")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"{ width: `${buttonWidth}px`, marginLeft: `${buttonWidth * 4 + 24 }px`}"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"rightTop"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("RT"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"right"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("Right"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"rightBottom"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("RB"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v(":style")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v("\"{ marginLeft: `${buttonWidth}px`, clear: 'both', whiteSpace: 'nowrap' }\"")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"bottomLeft"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("BL"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"bottom"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("Bottom"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"bottomRight"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"title"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),a("span",[s._v("{{")]),s._v("text"),a("span",[s._v("}}")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("p")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("BR"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(">")]),s._v("\n"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),a("span",{staticClass:"javascript"},[s._v("\n "),a("span",{staticClass:"hljs-keyword"},[s._v("import")]),s._v(" { message } "),a("span",{staticClass:"hljs-keyword"},[s._v("from")]),s._v(" "),a("span",{staticClass:"hljs-string"},[s._v("'ant-design-vue'")]),s._v(";\n\n "),a("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),a("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),a("span",{staticClass:"hljs-attr"},[s._v("buttonWidth")]),s._v(": "),a("span",{staticClass:"hljs-number"},[s._v("70")]),s._v(",\n "),a("span",{staticClass:"hljs-attr"},[s._v("text")]),s._v(": "),a("span",{staticClass:"hljs-string"},[s._v("'Are you sure to delete this task?'")]),s._v(",\n };\n },\n "),a("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n confirm() {\n message.info("),a("span",{staticClass:"hljs-string"},[s._v("'Clicked on Yes.'")]),s._v(");\n },\n },\n };\n")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n"),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("style")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("scoped")]),s._v(">")]),a("span",{staticClass:"css"},[s._v("\n "),a("span",{staticClass:"hljs-selector-id"},[s._v("#components-a-popconfirm-demo-placement")]),s._v(" "),a("span",{staticClass:"hljs-selector-class"},[s._v(".ant-btn")]),s._v(" {\n "),a("span",{staticClass:"hljs-attribute"},[s._v("width")]),s._v(": "),a("span",{staticClass:"hljs-number"},[s._v("70px")]),s._v(";\n "),a("span",{staticClass:"hljs-attribute"},[s._v("text-align")]),s._v(": center;\n "),a("span",{staticClass:"hljs-attribute"},[s._v("padding")]),s._v(": "),a("span",{staticClass:"hljs-number"},[s._v("0")]),s._v(";\n "),a("span",{staticClass:"hljs-attribute"},[s._v("margin-right")]),s._v(": "),a("span",{staticClass:"hljs-number"},[s._v("8px")]),s._v(";\n "),a("span",{staticClass:"hljs-attribute"},[s._v("margin-bottom")]),s._v(": "),a("span",{staticClass:"hljs-number"},[s._v("8px")]),s._v(";\n }\n")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("style")]),s._v(">")]),s._v("\n")])])])],2)]],2)};o._withStripped=!0;var r=a(1191),h={data:function(){return{buttonWidth:70,text:"Are you sure to delete this task?"}},methods:{confirm:function(){r.a.info("Clicked on Yes.")}}},m=(a(1311),Object(l.a)(h,o,[],!1,null,"3af14ecf",null));m.options.__file="components/popconfirm/demo/placement.md";var C=m.exports,j=function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <div>\n <a-popconfirm title="Are you sure delete this task?" :visible="visible" @visibleChange="handleVisibleChange" @confirm="confirm" @cancel="cancel" okText="Yes" cancelText="No">\n <a href="#">Delete a task</a>\n </a-popconfirm>\n <br/>\n <br/>\n Whether directly execute：<a-checkbox defaultChecked="" @change="changeCondition"/>\n </div>\n',script:"\n import { message } from 'ant-design-vue';\n\n export default {\n data() {\n return {\n visible: false,\n condition: true,\n };\n },\n methods: {\n changeCondition(e) {\n this.condition = e.target.checked;\n },\n confirm() {\n this.visible = false;\n message.success('Next step.');\n },\n cancel() {\n this.visible = false;\n message.error('Click on cancel.');\n },\n handleVisibleChange(visible) {\n if (!visible) {\n this.visible = false;\n return;\n }\n // Determining condition before show the popconfirm.\n console.log(this.condition);\n if (this.condition) {\n this.confirm(); // next step\n } else {\n this.visible = true;\n }\n },\n },\n };\n",style:null,us:"\n#### Conditional trigger\nMake it pop up under some conditions.\n",cn:"\n#### 条件触发\n可以判断是否需要弹出。\n",sourceCode:'<template>\n <div>\n <a-popconfirm\n title="Are you sure delete this task?"\n :visible="visible"\n @visibleChange="handleVisibleChange"\n @confirm="confirm"\n @cancel="cancel"\n okText="Yes"\n cancelText="No"\n >\n <a href="#">Delete a task</a>\n </a-popconfirm>\n <br />\n <br />\n Whether directly execute：<a-checkbox defaultChecked @change="changeCondition" />\n </div>\n</template>\n<script>\n import { message } from \'ant-design-vue\';\n\n export default {\n data() {\n return {\n visible: false,\n condition: true,\n };\n },\n methods: {\n changeCondition(e) {\n this.condition = e.target.checked;\n },\n confirm() {\n this.visible = false;\n message.success(\'Next step.\');\n },\n cancel() {\n this.visible = false;\n message.error(\'Click on cancel.\');\n },\n handleVisibleChange(visible) {\n if (!visible) {\n this.visible = false;\n return;\n }\n // Determining condition before show the popconfirm.\n console.log(this.condition);\n if (this.condition) {\n this.confirm(); // next step\n } else {\n this.visible = true;\n }\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-popconfirm",{attrs:{title:"Are you sure delete this task?",visible:s.visible,okText:"Yes",cancelText:"No"},on:{visibleChange:s.handleVisibleChange,confirm:s.confirm,cancel:s.cancel}},[a("a",{attrs:{href:"#"}},[s._v("Delete a task")])]),s._v(" "),a("br"),s._v(" "),a("br"),s._v("\n Whether directly execute："),a("a-checkbox",{attrs:{defaultChecked:""},on:{change:s.changeCondition}})],1)]),s._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"条件触发"}},[s._v("条件触发 "),a("a",{staticClass:"anchor",attrs:{href:"#条件触发"}},[s._v("#")])]),s._v(" "),a("p",[s._v("可以判断是否需要弹出。")])]),s._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Conditional-trigger"}},[s._v("Conditional trigger "),a("a",{staticClass:"anchor",attrs:{href:"#Conditional-trigger"}},[s._v("#")])]),s._v(" "),a("p",[s._v("Make it pop up under some conditions.")])]),s._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v("title")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Are you sure delete this task?"')]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v(":visible")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"visible"')]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v("@visibleChange")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"handleVisibleChange"')]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v("@confirm")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"confirm"')]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v("@cancel")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"cancel"')]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v("okText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Yes"')]),s._v("\n "),a("span",{staticClass:"hljs-attr"},[s._v("cancelText")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"No"')]),s._v("\n >")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"#"')]),s._v(">")]),s._v("Delete a task"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("br")]),s._v(" />")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("br")]),s._v(" />")]),s._v("\n Whether directly execute："),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-checkbox")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("defaultChecked")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"changeCondition"')]),s._v(" />")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(">")]),s._v("\n"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),a("span",{staticClass:"javascript"},[s._v("\n "),a("span",{staticClass:"hljs-keyword"},[s._v("import")]),s._v(" { message } "),a("span",{staticClass:"hljs-keyword"},[s._v("from")]),s._v(" "),a("span",{staticClass:"hljs-string"},[s._v("'ant-design-vue'")]),s._v(";\n\n "),a("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),a("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),a("span",{staticClass:"hljs-attr"},[s._v("visible")]),s._v(": "),a("span",{staticClass:"hljs-literal"},[s._v("false")]),s._v(",\n "),a("span",{staticClass:"hljs-attr"},[s._v("condition")]),s._v(": "),a("span",{staticClass:"hljs-literal"},[s._v("true")]),s._v(",\n };\n },\n "),a("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n changeCondition(e) {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".condition = e.target.checked;\n },\n confirm() {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".visible = "),a("span",{staticClass:"hljs-literal"},[s._v("false")]),s._v(";\n message.success("),a("span",{staticClass:"hljs-string"},[s._v("'Next step.'")]),s._v(");\n },\n cancel() {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".visible = "),a("span",{staticClass:"hljs-literal"},[s._v("false")]),s._v(";\n message.error("),a("span",{staticClass:"hljs-string"},[s._v("'Click on cancel.'")]),s._v(");\n },\n handleVisibleChange(visible) {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("if")]),s._v(" (!visible) {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".visible = "),a("span",{staticClass:"hljs-literal"},[s._v("false")]),s._v(";\n "),a("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(";\n }\n "),a("span",{staticClass:"hljs-comment"},[s._v("// Determining condition before show the popconfirm.")]),s._v("\n "),a("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log("),a("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".condition);\n "),a("span",{staticClass:"hljs-keyword"},[s._v("if")]),s._v(" ("),a("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".condition) {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".confirm(); "),a("span",{staticClass:"hljs-comment"},[s._v("// next step")]),s._v("\n } "),a("span",{staticClass:"hljs-keyword"},[s._v("else")]),s._v(" {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".visible = "),a("span",{staticClass:"hljs-literal"},[s._v("true")]),s._v(";\n }\n },\n },\n };\n")]),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};j._withStripped=!0;var f={data:function(){return{visible:!1,condition:!0}},methods:{changeCondition:function(s){this.condition=s.target.checked},confirm:function(){this.visible=!1,r.a.success("Next step.")},cancel:function(){this.visible=!1,r.a.error("Click on cancel.")},handleVisibleChange:function(s){s?(console.log(this.condition),this.condition?this.confirm():this.visible=!0):this.visible=!1}}},d=Object(l.a)(f,j,[],!1,null,null,null);d.options.__file="components/popconfirm/demo/dynamic-trigger.md";var g=d.exports,u=function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-popconfirm title="Are you sure？">\n <a-icon slot="icon" type="question-circle-o" style="color: red"/>\n <a href="#">Delete</a>\n </a-popconfirm>\n',script:null,style:null,us:"\n#### Customize icon\nSet `icon` props to customize the icon.\n",cn:"\n#### 自定义 Icon 图标\n使用 `icon` 自定义提示 `icon`。\n",sourceCode:'<template>\n <a-popconfirm title="Are you sure？">\n <a-icon slot="icon" type="question-circle-o" style="color: red" />\n <a href="#">Delete</a>\n </a-popconfirm>\n</template>\n'}}},[a("template",{slot:"component"},[a("a-popconfirm",{attrs:{title:"Are you sure？"}},[a("a-icon",{staticStyle:{color:"red"},attrs:{slot:"icon",type:"question-circle-o"},slot:"icon"}),s._v(" "),a("a",{attrs:{href:"#"}},[s._v("Delete")])],1)],1),s._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"自定义-Icon-图标"}},[s._v("自定义 Icon 图标 "),a("a",{staticClass:"anchor",attrs:{href:"#自定义-Icon-图标"}},[s._v("#")])]),s._v(" "),a("p",[s._v("使用 "),a("code",[s._v("icon")]),s._v(" 自定义提示 "),a("code",[s._v("icon")]),s._v("。")])]),s._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Customize-icon"}},[s._v("Customize icon "),a("a",{staticClass:"anchor",attrs:{href:"#Customize-icon"}},[s._v("#")])]),s._v(" "),a("p",[s._v("Set "),a("code",[s._v("icon")]),s._v(" props to customize the icon.")])]),s._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("title")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"Are you sure？"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-icon")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"icon"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"question-circle-o"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("style")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"color: red"')]),s._v(" />")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"#"')]),s._v(">")]),s._v("Delete"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-popconfirm")]),s._v(">")]),s._v("\n"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n")])])])],2)]],2)};u._withStripped=!0;var x=Object(l.a)({},u,[],!1,null,null,null);x.options.__file="components/popconfirm/demo/icon.md";var b=x.exports,T=function(){var s=this.$createElement;this._self._c;return this._m(0)};T._withStripped=!0;var k=Object(l.a)({},T,[function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[a("h2",{attrs:{id:"API"}},[s._v("API "),a("a",{staticClass:"anchor",attrs:{href:"#API"}},[s._v("#")])]),s._v(" "),a("table",[a("thead",[a("tr",[a("th",[s._v("参数")]),s._v(" "),a("th",[s._v("说明")]),s._v(" "),a("th",[s._v("类型")]),s._v(" "),a("th",[s._v("默认值")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("cancelText")]),s._v(" "),a("td",[s._v("取消按钮文字")]),s._v(" "),a("td",[s._v("string|slot")]),s._v(" "),a("td",[s._v("取消")])]),s._v(" "),a("tr",[a("td",[s._v("okText")]),s._v(" "),a("td",[s._v("确认按钮文字")]),s._v(" "),a("td",[s._v("string|slot")]),s._v(" "),a("td",[s._v("确定")])]),s._v(" "),a("tr",[a("td",[s._v("okType")]),s._v(" "),a("td",[s._v("确认按钮类型")]),s._v(" "),a("td",[s._v("string")]),s._v(" "),a("td",[s._v("primary")])]),s._v(" "),a("tr",[a("td",[s._v("title")]),s._v(" "),a("td",[s._v("确认框的描述")]),s._v(" "),a("td",[s._v("string|slot")]),s._v(" "),a("td",[s._v("无")])]),s._v(" "),a("tr",[a("td",[s._v("icon")]),s._v(" "),a("td",[s._v("自定义弹出气泡 Icon 图标")]),s._v(" "),a("td",[s._v("vNode")]),s._v(" "),a("td",[s._v('<Icon type="exclamation-circle" />')])])])]),s._v(" "),a("h3",{attrs:{id:"事件"}},[s._v("事件 "),a("a",{staticClass:"anchor",attrs:{href:"#事件"}},[s._v("#")])]),s._v(" "),a("table",[a("thead",[a("tr",[a("th",[s._v("事件名称")]),s._v(" "),a("th",[s._v("说明")]),s._v(" "),a("th",[s._v("回调参数")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("cancel")]),s._v(" "),a("td",[s._v("点击取消的回调")]),s._v(" "),a("td",[s._v("function(e)")])]),s._v(" "),a("tr",[a("td",[s._v("confirm")]),s._v(" "),a("td",[s._v("点击确认的回调")]),s._v(" "),a("td",[s._v("function(e)")])]),s._v(" "),a("tr",[a("td",[s._v("visibleChange")]),s._v(" "),a("td",[s._v("显示隐藏的回调")]),s._v(" "),a("td",[s._v("function(visible)")])])])]),s._v(" "),a("p",[s._v("更多属性请参考 "),a("a",{attrs:{href:"/components/tooltip-cn/#API"}},[s._v("Tooltip")]),s._v("。")]),s._v(" "),a("h2",{attrs:{id:"注意"}},[s._v("注意 "),a("a",{staticClass:"anchor",attrs:{href:"#注意"}},[s._v("#")])]),s._v(" "),a("p",[s._v("请确保 "),a("code",{pre:!0},[s._v("Popconfirm")]),s._v(" 的子元素能接受 "),a("code",{pre:!0},[s._v("mouseenter")]),s._v("、"),a("code",{pre:!0},[s._v("mouseleave")]),s._v("、"),a("code",{pre:!0},[s._v("focus")]),s._v("、"),a("code",{pre:!0},[s._v("click")]),s._v(" 事件。")])])}],!1,null,null,null);k.options.__file="components/popconfirm/index.zh-CN.md";var y=k.exports,w=function(){var s=this.$createElement;this._self._c;return this._m(0)};w._withStripped=!0;var N=Object(l.a)({},w,[function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[a("h2",{attrs:{id:"API"}},[s._v("API "),a("a",{staticClass:"anchor",attrs:{href:"#API"}},[s._v("#")])]),s._v(" "),a("table",[a("thead",[a("tr",[a("th",[s._v("Param")]),s._v(" "),a("th",[s._v("Description")]),s._v(" "),a("th",[s._v("Type")]),s._v(" "),a("th",[s._v("Default value")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("cancelText")]),s._v(" "),a("td",[s._v("text of the Cancel button")]),s._v(" "),a("td",[s._v("string|slot")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("Cancel")])])]),s._v(" "),a("tr",[a("td",[s._v("okText")]),s._v(" "),a("td",[s._v("text of the Confirm button")]),s._v(" "),a("td",[s._v("string|slot")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("Confirm")])])]),s._v(" "),a("tr",[a("td",[s._v("okType")]),s._v(" "),a("td",[s._v("Button "),a("code",{pre:!0},[s._v("type")]),s._v(" of the Confirm button")]),s._v(" "),a("td",[s._v("string")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("primary")])])]),s._v(" "),a("tr",[a("td",[s._v("title")]),s._v(" "),a("td",[s._v("title of the confirmation box")]),s._v(" "),a("td",[s._v("string|slot")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("icon")]),s._v(" "),a("td",[s._v("customize icon of confirmation")]),s._v(" "),a("td",[s._v("vNode|slot")]),s._v(" "),a("td",[s._v('<Icon type="exclamation-circle" />')])])])]),s._v(" "),a("h3",{attrs:{id:"events"}},[s._v("events "),a("a",{staticClass:"anchor",attrs:{href:"#events"}},[s._v("#")])]),s._v(" "),a("table",[a("thead",[a("tr",[a("th",[s._v("Events Name")]),s._v(" "),a("th",[s._v("Description")]),s._v(" "),a("th",[s._v("Arguments")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("cancel")]),s._v(" "),a("td",[s._v("callback of cancel")]),s._v(" "),a("td",[s._v("function(e)")])]),s._v(" "),a("tr",[a("td",[s._v("confirm")]),s._v(" "),a("td",[s._v("callback of confirmation")]),s._v(" "),a("td",[s._v("function(e)")])]),s._v(" "),a("tr",[a("td",[s._v("visibleChange")]),s._v(" "),a("td",[s._v("Callback executed when visibility of the tooltip card is changed")]),s._v(" "),a("td",[s._v("function(visible)")])])])]),s._v(" "),a("p",[s._v("Consult "),a("a",{attrs:{href:"/components/tooltip/#API"}},[s._v("Tooltip's documentation")]),s._v(" to find more APIs.")]),s._v(" "),a("h2",{attrs:{id:"Note"}},[s._v("Note "),a("a",{staticClass:"anchor",attrs:{href:"#Note"}},[s._v("#")])]),s._v(" "),a("p",[s._v("Please ensure that the child node of "),a("code",{pre:!0},[s._v("Popconfirm")]),s._v(" accepts "),a("code",{pre:!0},[s._v("mouseenter")]),s._v(", "),a("code",{pre:!0},[s._v("mouseleave")]),s._v(", "),a("code",{pre:!0},[s._v("focus")]),s._v(", "),a("code",{pre:!0},[s._v("click")]),s._v(" events.")])])}],!1,null,null,null);N.options.__file="components/popconfirm/index.en-US.md";var Y=N.exports,L="# Popconfirm\n\n 点击元素，弹出气泡式的确认框。\n\n ## 何时使用\n\n 目标元素的操作需要用户进一步的确认时，在目标元素附近弹出浮层提示，询问用户。\n\n和 'confirm' 弹出的全屏居中模态对话框相比，交互形式更轻量。\n ## 代码演示",A="# Popconfirm\n\n A simple and compact confirmation dialog of an action.\n\n # When To Use\n\n A simple and compact dialog used for asking for user confirmation.\n\n The difference with the 'confirm' modal dialog is that it's more lightweight than the static popped full-screen confirm modal.\n ## Examples\n ",B={category:"Components",subtitle:"气泡确认框",type:"Feedback",title:"Popconfirm",render:function(){var s=arguments[0];return s("div",[s("md",{attrs:{cn:L,us:A}}),s(v),s(p),s(C),s(g),s(b),s("api",[s("template",{slot:"cn"},[s(y)]),s(Y)])])}},$=Object(l.a)(B,void 0,void 0,!1,null,null,null);$.options.__file="components/popconfirm/demo/index.vue";t.default=$.exports}}]);
Reference in New Issue View Git Blame Copy Permalink