(window.webpackJsonp=window.webpackJsonp||[]).push([[14],{1202:function(t,s,a){},1203:function(t,s,a){},1295:function(t,s,a){"use strict";var n=a(1202);a.n(n).a},1296:function(t,s,a){"use strict";var n=a(1203);a.n(n).a},1440:function(t,s,a){"use strict";a.r(s);var n=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n  <div>\n    <a-button type="primary">Primary</a-button>\n    <a-button>Default</a-button>\n    <a-button type="dashed">Dashed</a-button>\n    <a-button type="danger">Danger</a-button>\n    <a-config-provider :autoInsertSpaceInButton="false">\n      <a-button type="primary">按钮</a-button>\n    </a-config-provider>\n    <a-button type="primary">按钮</a-button>\n    <a-button type="link">Link</a-button>\n  </div>\n',script:null,style:null,us:"\n#### Type\nThere are `primary` button, `default` button, `dashed` button , `danger` button and `link` button in antd.\n",cn:"\n#### 按钮类型\n按钮有五种类型：主按钮、次按钮、虚线按钮、危险按钮和链接按钮。主按钮在同一个操作区域最多出现一次。\n",sourceCode:'<template>\n  <div>\n    <a-button type="primary">Primary</a-button>\n    <a-button>Default</a-button>\n    <a-button type="dashed">Dashed</a-button>\n    <a-button type="danger">Danger</a-button>\n    <a-config-provider :autoInsertSpaceInButton="false">\n      <a-button type="primary">按钮</a-button>\n    </a-config-provider>\n    <a-button type="primary">按钮</a-button>\n    <a-button type="link">Link</a-button>\n  </div>\n</template>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-button",{attrs:{type:"primary"}},[t._v("Primary")]),t._v(" "),a("a-button",[t._v("Default")]),t._v(" "),a("a-button",{attrs:{type:"dashed"}},[t._v("Dashed")]),t._v(" "),a("a-button",{attrs:{type:"danger"}},[t._v("Danger")]),t._v(" "),a("a-config-provider",{attrs:{autoInsertSpaceInButton:!1}},[a("a-button",{attrs:{type:"primary"}},[t._v("按钮")])],1),t._v(" "),a("a-button",{attrs:{type:"primary"}},[t._v("按钮")]),t._v(" "),a("a-button",{attrs:{type:"link"}},[t._v("Link")])],1)]),t._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"按钮类型"}},[t._v("按钮类型 "),a("a",{staticClass:"anchor",attrs:{href:"#按钮类型"}},[t._v("#")])]),t._v(" "),a("p",[t._v("按钮有五种类型：主按钮、次按钮、虚线按钮、危险按钮和链接按钮。主按钮在同一个操作区域最多出现一次。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Type"}},[t._v("Type "),a("a",{staticClass:"anchor",attrs:{href:"#Type"}},[t._v("#")])]),t._v(" "),a("p",[t._v("There are "),a("code",[t._v("primary")]),t._v(" button, "),a("code",[t._v("default")]),t._v(" button, "),a("code",[t._v("dashed")]),t._v(" button , "),a("code",[t._v("danger")]),t._v(" button and "),a("code",[t._v("link")]),t._v(" button in antd.")])]),t._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(">")]),t._v("Primary"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("Default"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"dashed"')]),t._v(">")]),t._v("Dashed"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"danger"')]),t._v(">")]),t._v("Danger"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-config-provider")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":autoInsertSpaceInButton")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"false"')]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(">")]),t._v("按钮"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-config-provider")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(">")]),t._v("按钮"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"link"')]),t._v(">")]),t._v("Link"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n")])])])],2)]],2)};n._withStripped=!0;var l=a(31),e=Object(l.a)({},n,[],!1,null,null,null);e.options.__file="components/button/demo/basic.md";var v=e.exports,_=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n  <div id="components-button-demo-button-group">\n    <h4>Basic</h4>\n    <a-button-group>\n      <a-button>Cancel</a-button>\n      <a-button type="primary">OK</a-button>\n    </a-button-group>\n    <a-button-group>\n      <a-button disabled="">L</a-button>\n      <a-button disabled="">M</a-button>\n      <a-button disabled="">R</a-button>\n    </a-button-group>\n    <a-button-group>\n      <a-button type="primary">L</a-button>\n      <a-button>M</a-button>\n      <a-button>M</a-button>\n      <a-button type="dashed">R</a-button>\n    </a-button-group>\n\n    <h4>With Icon</h4>\n    <a-button-group>\n      <a-button type="primary"> <a-icon type="left"/>Go back </a-button>\n      <a-button type="primary"> Go forward<a-icon type="right"/> </a-button>\n    </a-button-group>\n    <a-button-group>\n      <a-button type="primary" icon="cloud"/>\n      <a-button type="primary" icon="cloud-download"/>\n    </a-button-group>\n  </div>\n',script:null,style:"\n  #components-button-demo-button-group h4 {\n    margin: 16px 0;\n    font-size: 14px;\n    line-height: 1;\n    font-weight: normal;\n  }\n  #components-button-demo-button-group h4:first-child {\n    margin-top: 0;\n  }\n  #components-button-demo-button-group .ant-btn-group {\n    margin-right: 8px;\n  }\n",us:"\n#### Button Group\nButtons can be grouped by placing multiple `Button` components into a `Button.Group`.\nThe `size` can be set to `large`, `small` or left unset resulting in a default size.\n",cn:"\n#### 按钮组合\n可以将多个 `Button` 放入 `Button.Group` 的容器中。\n通过设置 `size` 为 `large` `small` 分别把按钮组合设为大、小尺寸。若不设置 `size`，则尺寸为中。\n",sourceCode:'<template>\n  <div id="components-button-demo-button-group">\n    <h4>Basic</h4>\n    <a-button-group>\n      <a-button>Cancel</a-button>\n      <a-button type="primary">OK</a-button>\n    </a-button-group>\n    <a-button-group>\n      <a-button disabled>L</a-button>\n      <a-button disabled>M</a-button>\n      <a-button disabled>R</a-button>\n    </a-button-group>\n    <a-button-group>\n      <a-button type="primary">L</a-button>\n      <a-button>M</a-button>\n      <a-button>M</a-button>\n      <a-button type="dashed">R</a-button>\n    </a-button-group>\n\n    <h4>With Icon</h4>\n    <a-button-group>\n      <a-button type="primary"> <a-icon type="left" />Go back </a-button>\n      <a-button type="primary"> Go forward<a-icon type="right" /> </a-button>\n    </a-button-group>\n    <a-button-group>\n      <a-button type="primary" icon="cloud" />\n      <a-button type="primary" icon="cloud-download" />\n    </a-button-group>\n  </div>\n</template>\n<style>\n  #components-button-demo-button-group h4 {\n    margin: 16px 0;\n    font-size: 14px;\n    line-height: 1;\n    font-weight: normal;\n  }\n  #components-button-demo-button-group h4:first-child {\n    margin-top: 0;\n  }\n  #components-button-demo-button-group .ant-btn-group {\n    margin-right: 8px;\n  }\n</style>\n'}}},[a("template",{slot:"component"},[a("div",{attrs:{id:"components-button-demo-button-group"}},[a("h4",[t._v("Basic")]),t._v(" "),a("a-button-group",[a("a-button",[t._v("Cancel")]),t._v(" "),a("a-button",{attrs:{type:"primary"}},[t._v("OK")])],1),t._v(" "),a("a-button-group",[a("a-button",{attrs:{disabled:""}},[t._v("L")]),t._v(" "),a("a-button",{attrs:{disabled:""}},[t._v("M")]),t._v(" "),a("a-button",{attrs:{disabled:""}},[t._v("R")])],1),t._v(" "),a("a-button-group",[a("a-button",{attrs:{type:"primary"}},[t._v("L")]),t._v(" "),a("a-button",[t._v("M")]),t._v(" "),a("a-button",[t._v("M")]),t._v(" "),a("a-button",{attrs:{type:"dashed"}},[t._v("R")])],1),t._v(" "),a("h4",[t._v("With Icon")]),t._v(" "),a("a-button-group",[a("a-button",{attrs:{type:"primary"}},[a("a-icon",{attrs:{type:"left"}}),t._v("Go back ")],1),t._v(" "),a("a-button",{attrs:{type:"primary"}},[t._v(" Go forward"),a("a-icon",{attrs:{type:"right"}})],1)],1),t._v(" "),a("a-button-group",[a("a-button",{attrs:{type:"primary",icon:"cloud"}}),t._v(" "),a("a-button",{attrs:{type:"primary",icon:"cloud-download"}})],1)],1)]),t._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"按钮组合"}},[t._v("按钮组合 "),a("a",{staticClass:"anchor",attrs:{href:"#按钮组合"}},[t._v("#")])]),t._v(" "),a("p",[t._v("可以将多个 "),a("code",[t._v("Button")]),t._v(" 放入 "),a("code",[t._v("Button.Group")]),t._v(" 的容器中。"),a("br"),t._v("\n通过设置 "),a("code",[t._v("size")]),t._v(" 为 "),a("code",[t._v("large")]),t._v(" "),a("code",[t._v("small")]),t._v(" 分别把按钮组合设为大、小尺寸。若不设置 "),a("code",[t._v("size")]),t._v("，则尺寸为中。"),a("br")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Button-Group"}},[t._v("Button Group "),a("a",{staticClass:"anchor",attrs:{href:"#Button-Group"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Buttons can be grouped by placing multiple "),a("code",[t._v("Button")]),t._v(" components into a "),a("code",[t._v("Button.Group")]),t._v("."),a("br"),t._v("\nThe "),a("code",[t._v("size")]),t._v(" can be set to "),a("code",[t._v("large")]),t._v(", "),a("code",[t._v("small")]),t._v(" or left unset resulting in a default size."),a("br")])]),t._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("id")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"components-button-demo-button-group"')]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("h4")]),t._v(">")]),t._v("Basic"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("h4")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("Cancel"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(">")]),t._v("OK"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("L"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("M"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("R"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(">")]),t._v("L"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("M"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("M"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"dashed"')]),t._v(">")]),t._v("R"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(">")]),t._v("\n\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("h4")]),t._v(">")]),t._v("With Icon"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("h4")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(">")]),t._v(" "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-icon")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"left"')]),t._v(" />")]),t._v("Go back "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(">")]),t._v(" Go forward"),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-icon")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"right"')]),t._v(" />")]),t._v(" "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"cloud"')]),t._v(" />")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"cloud-download"')]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("style")]),t._v(">")]),a("span",{staticClass:"css"},[t._v("\n  "),a("span",{staticClass:"hljs-selector-id"},[t._v("#components-button-demo-button-group")]),t._v(" "),a("span",{staticClass:"hljs-selector-tag"},[t._v("h4")]),t._v(" {\n    "),a("span",{staticClass:"hljs-attribute"},[t._v("margin")]),t._v(": "),a("span",{staticClass:"hljs-number"},[t._v("16px")]),t._v(" "),a("span",{staticClass:"hljs-number"},[t._v("0")]),t._v(";\n    "),a("span",{staticClass:"hljs-attribute"},[t._v("font-size")]),t._v(": "),a("span",{staticClass:"hljs-number"},[t._v("14px")]),t._v(";\n    "),a("span",{staticClass:"hljs-attribute"},[t._v("line-height")]),t._v(": "),a("span",{staticClass:"hljs-number"},[t._v("1")]),t._v(";\n    "),a("span",{staticClass:"hljs-attribute"},[t._v("font-weight")]),t._v(": normal;\n  }\n  "),a("span",{staticClass:"hljs-selector-id"},[t._v("#components-button-demo-button-group")]),t._v(" "),a("span",{staticClass:"hljs-selector-tag"},[t._v("h4")]),a("span",{staticClass:"hljs-selector-pseudo"},[t._v(":first-child")]),t._v(" {\n    "),a("span",{staticClass:"hljs-attribute"},[t._v("margin-top")]),t._v(": "),a("span",{staticClass:"hljs-number"},[t._v("0")]),t._v(";\n  }\n  "),a("span",{staticClass:"hljs-selector-id"},[t._v("#components-button-demo-button-group")]),t._v(" "),a("span",{staticClass:"hljs-selector-class"},[t._v(".ant-btn-group")]),t._v(" {\n    "),a("span",{staticClass:"hljs-attribute"},[t._v("margin-right")]),t._v(": "),a("span",{staticClass:"hljs-number"},[t._v("8px")]),t._v(";\n  }\n")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("style")]),t._v(">")]),t._v("\n")])])])],2)]],2)};_._withStripped=!0;a(1295);var i=Object(l.a)({},_,[],!1,null,null,null);i.options.__file="components/button/demo/button-group.md";var o=i.exports,p=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n  <div>\n    <a-button type="primary">Primary</a-button>\n    <a-button type="primary" disabled="">Primary(disabled)</a-button>\n    <br/>\n    <a-button>Default</a-button>\n    <a-button disabled="">Default(disabled)</a-button>\n    <br/>\n    <a-button type="dashed">Dashed</a-button>\n    <a-button type="dashed" disabled="">Dashed(disabled)</a-button>\n    <br/>\n    <a-button type="link">Link</a-button>\n    <a-button type="link" disabled="">Link(disabled)</a-button>\n    <div :style="{ padding: \'8px 8px 0 8px\', background: \'rgb(190, 200, 200)\' }">\n      <a-button ghost="">Ghost</a-button>\n      <a-button ghost="" disabled="">Ghost(disabled)</a-button>\n    </div>\n  </div>\n',script:null,style:null,us:"\n#### Disabled\nTo mark a button as disabled, add the `disabled` property to the `Button`.\n",cn:"\n#### 不可用状态\n添加 `disabled` 属性即可让按钮处于不可用状态，同时按钮样式也会改变。\n",sourceCode:'<template>\n  <div>\n    <a-button type="primary">Primary</a-button>\n    <a-button type="primary" disabled>Primary(disabled)</a-button>\n    <br />\n    <a-button>Default</a-button>\n    <a-button disabled>Default(disabled)</a-button>\n    <br />\n    <a-button type="dashed">Dashed</a-button>\n    <a-button type="dashed" disabled>Dashed(disabled)</a-button>\n    <br />\n    <a-button type="link">Link</a-button>\n    <a-button type="link" disabled>Link(disabled)</a-button>\n    <div :style="{ padding: \'8px 8px 0 8px\', background: \'rgb(190, 200, 200)\' }">\n      <a-button ghost>Ghost</a-button>\n      <a-button ghost disabled>Ghost(disabled)</a-button>\n    </div>\n  </div>\n</template>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-button",{attrs:{type:"primary"}},[t._v("Primary")]),t._v(" "),a("a-button",{attrs:{type:"primary",disabled:""}},[t._v("Primary(disabled)")]),t._v(" "),a("br"),t._v(" "),a("a-button",[t._v("Default")]),t._v(" "),a("a-button",{attrs:{disabled:""}},[t._v("Default(disabled)")]),t._v(" "),a("br"),t._v(" "),a("a-button",{attrs:{type:"dashed"}},[t._v("Dashed")]),t._v(" "),a("a-button",{attrs:{type:"dashed",disabled:""}},[t._v("Dashed(disabled)")]),t._v(" "),a("br"),t._v(" "),a("a-button",{attrs:{type:"link"}},[t._v("Link")]),t._v(" "),a("a-button",{attrs:{type:"link",disabled:""}},[t._v("Link(disabled)")]),t._v(" "),a("div",{style:{padding:"8px 8px 0 8px",background:"rgb(190, 200, 200)"}},[a("a-button",{attrs:{ghost:""}},[t._v("Ghost")]),t._v(" "),a("a-button",{attrs:{ghost:"",disabled:""}},[t._v("Ghost(disabled)")])],1)],1)]),t._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"不可用状态"}},[t._v("不可用状态 "),a("a",{staticClass:"anchor",attrs:{href:"#不可用状态"}},[t._v("#")])]),t._v(" "),a("p",[t._v("添加 "),a("code",[t._v("disabled")]),t._v(" 属性即可让按钮处于不可用状态，同时按钮样式也会改变。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Disabled"}},[t._v("Disabled "),a("a",{staticClass:"anchor",attrs:{href:"#Disabled"}},[t._v("#")])]),t._v(" "),a("p",[t._v("To mark a button as disabled, add the "),a("code",[t._v("disabled")]),t._v(" property to the "),a("code",[t._v("Button")]),t._v(".")])]),t._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(">")]),t._v("Primary"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("Primary(disabled)"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("br")]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("Default"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("Default(disabled)"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("br")]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"dashed"')]),t._v(">")]),t._v("Dashed"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"dashed"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("Dashed(disabled)"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("br")]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"link"')]),t._v(">")]),t._v("Link"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"link"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("Link(disabled)"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v("\"{ padding: '8px 8px 0 8px', background: 'rgb(190, 200, 200)' }\"")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("ghost")]),t._v(">")]),t._v("Ghost"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("ghost")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("Ghost(disabled)"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n")])])])],2)]],2)};p._withStripped=!0;var r=Object(l.a)({},p,[],!1,null,null,null);r.options.__file="components/button/demo/disabled.md";var c=r.exports,h=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n  <div :style="{ background: \'rgb(190, 200, 200)\', padding: \'26px 16px 16px\' }">\n    <a-button type="primary" ghost="">Primary</a-button>\n    <a-button ghost="">Default</a-button>\n    <a-button type="dashed" ghost="">Dashed</a-button>\n    <a-button type="danger" ghost="">Danger</a-button>\n    <a-button type="link" ghost="">Link</a-button>\n  </div>\n',script:null,style:null,us:"\n#### Ghost Button\n`ghost` property will make button's background transparent, it is common used in colored background.\n",cn:"\n#### 幽灵按钮\n幽灵按钮将其他按钮的内容反色，背景变为透明，常用在有色背景上。\n",sourceCode:'<template>\n  <div :style="{ background: \'rgb(190, 200, 200)\', padding: \'26px 16px 16px\' }">\n    <a-button type="primary" ghost>Primary</a-button>\n    <a-button ghost>Default</a-button>\n    <a-button type="dashed" ghost>Dashed</a-button>\n    <a-button type="danger" ghost>Danger</a-button>\n    <a-button type="link" ghost>Link</a-button>\n  </div>\n</template>\n'}}},[a("template",{slot:"component"},[a("div",{style:{background:"rgb(190, 200, 200)",padding:"26px 16px 16px"}},[a("a-button",{attrs:{type:"primary",ghost:""}},[t._v("Primary")]),t._v(" "),a("a-button",{attrs:{ghost:""}},[t._v("Default")]),t._v(" "),a("a-button",{attrs:{type:"dashed",ghost:""}},[t._v("Dashed")]),t._v(" "),a("a-button",{attrs:{type:"danger",ghost:""}},[t._v("Danger")]),t._v(" "),a("a-button",{attrs:{type:"link",ghost:""}},[t._v("Link")])],1)]),t._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"幽灵按钮"}},[t._v("幽灵按钮 "),a("a",{staticClass:"anchor",attrs:{href:"#幽灵按钮"}},[t._v("#")])]),t._v(" "),a("p",[t._v("幽灵按钮将其他按钮的内容反色，背景变为透明，常用在有色背景上。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Ghost-Button"}},[t._v("Ghost Button "),a("a",{staticClass:"anchor",attrs:{href:"#Ghost-Button"}},[t._v("#")])]),t._v(" "),a("p",[a("code",[t._v("ghost")]),t._v(" property will make button's background transparent, it is common used in colored background.")])]),t._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v("\"{ background: 'rgb(190, 200, 200)', padding: '26px 16px 16px' }\"")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("ghost")]),t._v(">")]),t._v("Primary"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("ghost")]),t._v(">")]),t._v("Default"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"dashed"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("ghost")]),t._v(">")]),t._v("Dashed"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"danger"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("ghost")]),t._v(">")]),t._v("Danger"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"link"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("ghost")]),t._v(">")]),t._v("Link"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n")])])])],2)]],2)};h._withStripped=!0;var d=Object(l.a)({},h,[],!1,null,null,null);d.options.__file="components/button/demo/ghost.md";var u=d.exports,b=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n  <div>\n    <a-button type="primary" shape="circle" icon="search"/>\n    <a-button type="primary" icon="search">Search</a-button>\n    <a-button shape="circle" icon="search"/>\n    <a-button icon="search">Search</a-button>\n    <a-button shape="circle" icon="search"/>\n    <a-button icon="search">Search</a-button>\n    <a-button type="dashed" shape="circle" icon="search"/>\n    <a-button type="dashed" icon="search">Search</a-button>\n  </div>\n',script:null,style:null,us:"\n#### Icon\n`Button` components can contain an `Icon`. This is done by setting the `icon` property or placing an `Icon` component within the `Button`\nIf you want specific control over the positioning and placement of the `Icon`, then that should be done by placing the `Icon` component within the `Button` rather than using the `icon` property.\n",cn:"\n#### 图标按钮\n当需要在 `Button` 内嵌入 `Icon` 时，可以设置 `icon` 属性，或者直接在 `Button` 内使用 `Icon` 组件。\n如果想控制 `Icon` 具体的位置，只能直接使用 `Icon` 组件，而非 `icon` 属性。\n",sourceCode:'<template>\n  <div>\n    <a-button type="primary" shape="circle" icon="search"></a-button>\n    <a-button type="primary" icon="search">Search</a-button>\n    <a-button shape="circle" icon="search" />\n    <a-button icon="search">Search</a-button>\n    <a-button shape="circle" icon="search" />\n    <a-button icon="search">Search</a-button>\n    <a-button type="dashed" shape="circle" icon="search" />\n    <a-button type="dashed" icon="search">Search</a-button>\n  </div>\n</template>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-button",{attrs:{type:"primary",shape:"circle",icon:"search"}}),t._v(" "),a("a-button",{attrs:{type:"primary",icon:"search"}},[t._v("Search")]),t._v(" "),a("a-button",{attrs:{shape:"circle",icon:"search"}}),t._v(" "),a("a-button",{attrs:{icon:"search"}},[t._v("Search")]),t._v(" "),a("a-button",{attrs:{shape:"circle",icon:"search"}}),t._v(" "),a("a-button",{attrs:{icon:"search"}},[t._v("Search")]),t._v(" "),a("a-button",{attrs:{type:"dashed",shape:"circle",icon:"search"}}),t._v(" "),a("a-button",{attrs:{type:"dashed",icon:"search"}},[t._v("Search")])],1)]),t._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"图标按钮"}},[t._v("图标按钮 "),a("a",{staticClass:"anchor",attrs:{href:"#图标按钮"}},[t._v("#")])]),t._v(" "),a("p",[t._v("当需要在 "),a("code",[t._v("Button")]),t._v(" 内嵌入 "),a("code",[t._v("Icon")]),t._v(" 时，可以设置 "),a("code",[t._v("icon")]),t._v(" 属性，或者直接在 "),a("code",[t._v("Button")]),t._v(" 内使用 "),a("code",[t._v("Icon")]),t._v(" 组件。"),a("br"),t._v("\n如果想控制 "),a("code",[t._v("Icon")]),t._v(" 具体的位置，只能直接使用 "),a("code",[t._v("Icon")]),t._v(" 组件，而非 "),a("code",[t._v("icon")]),t._v(" 属性。"),a("br")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Icon"}},[t._v("Icon "),a("a",{staticClass:"anchor",attrs:{href:"#Icon"}},[t._v("#")])]),t._v(" "),a("p",[a("code",[t._v("Button")]),t._v(" components can contain an "),a("code",[t._v("Icon")]),t._v(". This is done by setting the "),a("code",[t._v("icon")]),t._v(" property or placing an "),a("code",[t._v("Icon")]),t._v(" component within the "),a("code",[t._v("Button")]),a("br"),t._v("\nIf you want specific control over the positioning and placement of the "),a("code",[t._v("Icon")]),t._v(", then that should be done by placing the "),a("code",[t._v("Icon")]),t._v(" component within the "),a("code",[t._v("Button")]),t._v(" rather than using the "),a("code",[t._v("icon")]),t._v(" property."),a("br")])]),t._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("shape")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"circle"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"search"')]),t._v(">")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"search"')]),t._v(">")]),t._v("Search"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("shape")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"circle"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"search"')]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"search"')]),t._v(">")]),t._v("Search"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("shape")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"circle"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"search"')]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"search"')]),t._v(">")]),t._v("Search"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"dashed"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("shape")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"circle"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"search"')]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"dashed"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"search"')]),t._v(">")]),t._v("Search"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n")])])])],2)]],2)};b._withStripped=!0;var C=Object(l.a)({},b,[],!1,null,null,null);C.options.__file="components/button/demo/icon.md";var m=C.exports,j=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n  <div>\n    <a-button type="primary" loading="">\n      Loading\n    </a-button>\n    <a-button type="primary" size="small" loading="">\n      Loading\n    </a-button>\n    <br/>\n    <a-button type="primary" :loading="loading" @mouseenter="enterLoading">\n      mouseenter me!\n    </a-button>\n    <a-button type="primary" icon="poweroff" :loading="iconLoading" @click="enterIconLoading">\n      延迟1s\n    </a-button>\n    <br/>\n    <a-button type="primary" loading=""/>\n    <a-button shape="circle" loading=""/>\n    <a-button type="primary" shape="circle" loading=""/>\n  </div>\n',script:"\n  export default {\n    data() {\n      return {\n        loading: false,\n        iconLoading: false,\n      };\n    },\n    methods: {\n      enterLoading() {\n        this.loading = true;\n      },\n      enterIconLoading() {\n        this.iconLoading = { delay: 1000 };\n      },\n    },\n  };\n",style:null,us:"\n#### Loading\nA loading indicator can be added to a button by setting the `loading` property on the `Button`.\n",cn:"\n#### 加载中状态\n添加 `loading` 属性即可让按钮处于加载状态，最后两个按钮演示点击后进入加载状态。\n",sourceCode:'<template>\n  <div>\n    <a-button type="primary" loading>\n      Loading\n    </a-button>\n    <a-button type="primary" size="small" loading>\n      Loading\n    </a-button>\n    <br />\n    <a-button type="primary" :loading="loading" @mouseenter="enterLoading">\n      mouseenter me!\n    </a-button>\n    <a-button type="primary" icon="poweroff" :loading="iconLoading" @click="enterIconLoading">\n      延迟1s\n    </a-button>\n    <br />\n    <a-button type="primary" loading />\n    <a-button shape="circle" loading />\n    <a-button type="primary" shape="circle" loading />\n  </div>\n</template>\n<script>\n  export default {\n    data() {\n      return {\n        loading: false,\n        iconLoading: false,\n      };\n    },\n    methods: {\n      enterLoading() {\n        this.loading = true;\n      },\n      enterIconLoading() {\n        this.iconLoading = { delay: 1000 };\n      },\n    },\n  };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-button",{attrs:{type:"primary",loading:""}},[t._v("\n      Loading\n    ")]),t._v(" "),a("a-button",{attrs:{type:"primary",size:"small",loading:""}},[t._v("\n      Loading\n    ")]),t._v(" "),a("br"),t._v(" "),a("a-button",{attrs:{type:"primary",loading:t.loading},on:{mouseenter:t.enterLoading}},[t._v("\n      mouseenter me!\n    ")]),t._v(" "),a("a-button",{attrs:{type:"primary",icon:"poweroff",loading:t.iconLoading},on:{click:t.enterIconLoading}},[t._v("\n      延迟1s\n    ")]),t._v(" "),a("br"),t._v(" "),a("a-button",{attrs:{type:"primary",loading:""}}),t._v(" "),a("a-button",{attrs:{shape:"circle",loading:""}}),t._v(" "),a("a-button",{attrs:{type:"primary",shape:"circle",loading:""}})],1)]),t._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"加载中状态"}},[t._v("加载中状态 "),a("a",{staticClass:"anchor",attrs:{href:"#加载中状态"}},[t._v("#")])]),t._v(" "),a("p",[t._v("添加 "),a("code",[t._v("loading")]),t._v(" 属性即可让按钮处于加载状态，最后两个按钮演示点击后进入加载状态。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Loading"}},[t._v("Loading "),a("a",{staticClass:"anchor",attrs:{href:"#Loading"}},[t._v("#")])]),t._v(" "),a("p",[t._v("A loading indicator can be added to a button by setting the "),a("code",[t._v("loading")]),t._v(" property on the "),a("code",[t._v("Button")]),t._v(".")])]),t._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("loading")]),t._v(">")]),t._v("\n      Loading\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"small"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("loading")]),t._v(">")]),t._v("\n      Loading\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("br")]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":loading")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"loading"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("@mouseenter")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"enterLoading"')]),t._v(">")]),t._v("\n      mouseenter me!\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"poweroff"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":loading")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"iconLoading"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("@click")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"enterIconLoading"')]),t._v(">")]),t._v("\n      延迟1s\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("br")]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("loading")]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("shape")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"circle"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("loading")]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("shape")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"circle"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("loading")]),t._v(" />")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),a("span",{staticClass:"javascript"},[t._v("\n  "),a("span",{staticClass:"hljs-keyword"},[t._v("export")]),t._v(" "),a("span",{staticClass:"hljs-keyword"},[t._v("default")]),t._v(" {\n    data() {\n      "),a("span",{staticClass:"hljs-keyword"},[t._v("return")]),t._v(" {\n        "),a("span",{staticClass:"hljs-attr"},[t._v("loading")]),t._v(": "),a("span",{staticClass:"hljs-literal"},[t._v("false")]),t._v(",\n        "),a("span",{staticClass:"hljs-attr"},[t._v("iconLoading")]),t._v(": "),a("span",{staticClass:"hljs-literal"},[t._v("false")]),t._v(",\n      };\n    },\n    "),a("span",{staticClass:"hljs-attr"},[t._v("methods")]),t._v(": {\n      enterLoading() {\n        "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".loading = "),a("span",{staticClass:"hljs-literal"},[t._v("true")]),t._v(";\n      },\n      enterIconLoading() {\n        "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".iconLoading = { "),a("span",{staticClass:"hljs-attr"},[t._v("delay")]),t._v(": "),a("span",{staticClass:"hljs-number"},[t._v("1000")]),t._v(" };\n      },\n    },\n  };\n")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),t._v("\n")])])])],2)]],2)};j._withStripped=!0;var g={data:function(){return{loading:!1,iconLoading:!1}},methods:{enterLoading:function(){this.loading=!0},enterIconLoading:function(){this.iconLoading={delay:1e3}}}},y=Object(l.a)(g,j,[],!1,null,null,null);y.options.__file="components/button/demo/loading.md";var f=y.exports,k=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n  <div>\n    <a-button type="primary">Primary</a-button>\n    <a-button>secondary</a-button>\n    <a-dropdown>\n      <a-menu slot="overlay" @click="handleMenuClick">\n        <a-menu-item key="1">1st item</a-menu-item>\n        <a-menu-item key="2">2nd item</a-menu-item>\n        <a-menu-item key="3">3rd item</a-menu-item>\n      </a-menu>\n      <a-button> Actions <a-icon type="down"/> </a-button>\n    </a-dropdown>\n  </div>\n',script:"\n  export default {\n    methods: {\n      handleMenuClick(e) {\n        console.log('click', e);\n      },\n    },\n  };\n",style:null,us:"\n#### Multiple Buttons\nIf you need several buttons, we recommend that you use 1 primary button + n secondary buttons, and if there are more than three operations, you can group some of them into `Dropdown.Button`.\n",cn:"\n#### 多个按钮组合\n按钮组合使用时，推荐使用1个主操作 + n 个次操作，3个以上操作时把更多操作放到 `Dropdown.Button` 中组合使用。\n",sourceCode:'<template>\n  <div>\n    <a-button type="primary">Primary</a-button>\n    <a-button>secondary</a-button>\n    <a-dropdown>\n      <a-menu slot="overlay" @click="handleMenuClick">\n        <a-menu-item key="1">1st item</a-menu-item>\n        <a-menu-item key="2">2nd item</a-menu-item>\n        <a-menu-item key="3">3rd item</a-menu-item>\n      </a-menu>\n      <a-button> Actions <a-icon type="down" /> </a-button>\n    </a-dropdown>\n  </div>\n</template>\n<script>\n  export default {\n    methods: {\n      handleMenuClick(e) {\n        console.log(\'click\', e);\n      },\n    },\n  };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-button",{attrs:{type:"primary"}},[t._v("Primary")]),t._v(" "),a("a-button",[t._v("secondary")]),t._v(" "),a("a-dropdown",[a("a-menu",{attrs:{slot:"overlay"},on:{click:t.handleMenuClick},slot:"overlay"},[a("a-menu-item",{key:"1"},[t._v("1st item")]),t._v(" "),a("a-menu-item",{key:"2"},[t._v("2nd item")]),t._v(" "),a("a-menu-item",{key:"3"},[t._v("3rd item")])],1),t._v(" "),a("a-button",[t._v(" Actions "),a("a-icon",{attrs:{type:"down"}})],1)],1)],1)]),t._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"多个按钮组合"}},[t._v("多个按钮组合 "),a("a",{staticClass:"anchor",attrs:{href:"#多个按钮组合"}},[t._v("#")])]),t._v(" "),a("p",[t._v("按钮组合使用时，推荐使用1个主操作 + n 个次操作，3个以上操作时把更多操作放到 "),a("code",[t._v("Dropdown.Button")]),t._v(" 中组合使用。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Multiple-Buttons"}},[t._v("Multiple Buttons "),a("a",{staticClass:"anchor",attrs:{href:"#Multiple-Buttons"}},[t._v("#")])]),t._v(" "),a("p",[t._v("If you need several buttons, we recommend that you use 1 primary button + n secondary buttons, and if there are more than three operations, you can group some of them into "),a("code",[t._v("Dropdown.Button")]),t._v(".")])]),t._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(">")]),t._v("Primary"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("secondary"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-dropdown")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-menu")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("slot")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"overlay"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("@click")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleMenuClick"')]),t._v(">")]),t._v("\n        "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-menu-item")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"1"')]),t._v(">")]),t._v("1st item"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-menu-item")]),t._v(">")]),t._v("\n        "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-menu-item")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"2"')]),t._v(">")]),t._v("2nd item"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-menu-item")]),t._v(">")]),t._v("\n        "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-menu-item")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"3"')]),t._v(">")]),t._v("3rd item"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-menu-item")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-menu")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v(" Actions "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-icon")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"down"')]),t._v(" />")]),t._v(" "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-dropdown")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),a("span",{staticClass:"javascript"},[t._v("\n  "),a("span",{staticClass:"hljs-keyword"},[t._v("export")]),t._v(" "),a("span",{staticClass:"hljs-keyword"},[t._v("default")]),t._v(" {\n    "),a("span",{staticClass:"hljs-attr"},[t._v("methods")]),t._v(": {\n      handleMenuClick(e) {\n        "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("'click'")]),t._v(", e);\n      },\n    },\n  };\n")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),t._v("\n")])])])],2)]],2)};k._withStripped=!0;var z={methods:{handleMenuClick:function(t){console.log("click",t)}}},w=Object(l.a)(z,k,[],!1,null,null,null);w.options.__file="components/button/demo/multiple.md";var D=w.exports,L=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n  <div>\n    <a-radio-group :value="size" @change="handleSizeChange">\n      <a-radio-button value="large">Large</a-radio-button>\n      <a-radio-button value="default">Default</a-radio-button>\n      <a-radio-button value="small">Small</a-radio-button>\n    </a-radio-group>\n    <br/><br/>\n    <a-button type="primary" :size="size">Primary</a-button>\n    <a-button :size="size">Normal</a-button>\n    <a-button type="dashed" :size="size">Dashed</a-button>\n    <a-button type="danger" :size="size">Danger</a-button>\n    <a-button type="link" :size="size">Link</a-button>\n    <br/>\n    <a-button type="primary" shape="circle" icon="download" :size="size"/>\n    <a-button type="primary" shape="round" icon="download" :size="size">Download</a-button>\n    <a-button type="primary" icon="download" :size="size">Download</a-button>\n    <br/>\n    <a-button-group :size="size">\n      <a-button type="primary"> <a-icon type="left"/>Backward </a-button>\n      <a-button type="primary"> Forward<a-icon type="right"/> </a-button>\n    </a-button-group>\n  </div>\n',script:"\n  export default {\n    data() {\n      return {\n        size: 'large',\n      };\n    },\n    methods: {\n      handleSizeChange(e) {\n        this.size = e.target.value;\n      },\n    },\n  };\n",style:null,us:"\n#### Size\nAnt Design supports a default button size as well as a large and small size.\nIf a large or small button is desired, set the `size` property to either `large` or `small` respectively. Omit the `size` property for a button with the default size.\n",cn:"\n#### 按钮尺寸\n按钮有大、中、小三种尺寸。\n通过设置 `size` 为 `large` `small` 分别把按钮设为大、小尺寸。若不设置 `size`，则尺寸为中。\n",sourceCode:'<template>\n  <div>\n    <a-radio-group :value="size" @change="handleSizeChange">\n      <a-radio-button value="large">Large</a-radio-button>\n      <a-radio-button value="default">Default</a-radio-button>\n      <a-radio-button value="small">Small</a-radio-button>\n    </a-radio-group>\n    <br /><br />\n    <a-button type="primary" :size="size">Primary</a-button>\n    <a-button :size="size">Normal</a-button>\n    <a-button type="dashed" :size="size">Dashed</a-button>\n    <a-button type="danger" :size="size">Danger</a-button>\n    <a-button type="link" :size="size">Link</a-button>\n    <br />\n    <a-button type="primary" shape="circle" icon="download" :size="size" />\n    <a-button type="primary" shape="round" icon="download" :size="size">Download</a-button>\n    <a-button type="primary" icon="download" :size="size">Download</a-button>\n    <br />\n    <a-button-group :size="size">\n      <a-button type="primary"> <a-icon type="left" />Backward </a-button>\n      <a-button type="primary"> Forward<a-icon type="right" /> </a-button>\n    </a-button-group>\n  </div>\n</template>\n<script>\n  export default {\n    data() {\n      return {\n        size: \'large\',\n      };\n    },\n    methods: {\n      handleSizeChange(e) {\n        this.size = e.target.value;\n      },\n    },\n  };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-radio-group",{attrs:{value:t.size},on:{change:t.handleSizeChange}},[a("a-radio-button",{attrs:{value:"large"}},[t._v("Large")]),t._v(" "),a("a-radio-button",{attrs:{value:"default"}},[t._v("Default")]),t._v(" "),a("a-radio-button",{attrs:{value:"small"}},[t._v("Small")])],1),t._v(" "),a("br"),a("br"),t._v(" "),a("a-button",{attrs:{type:"primary",size:t.size}},[t._v("Primary")]),t._v(" "),a("a-button",{attrs:{size:t.size}},[t._v("Normal")]),t._v(" "),a("a-button",{attrs:{type:"dashed",size:t.size}},[t._v("Dashed")]),t._v(" "),a("a-button",{attrs:{type:"danger",size:t.size}},[t._v("Danger")]),t._v(" "),a("a-button",{attrs:{type:"link",size:t.size}},[t._v("Link")]),t._v(" "),a("br"),t._v(" "),a("a-button",{attrs:{type:"primary",shape:"circle",icon:"download",size:t.size}}),t._v(" "),a("a-button",{attrs:{type:"primary",shape:"round",icon:"download",size:t.size}},[t._v("Download")]),t._v(" "),a("a-button",{attrs:{type:"primary",icon:"download",size:t.size}},[t._v("Download")]),t._v(" "),a("br"),t._v(" "),a("a-button-group",{attrs:{size:t.size}},[a("a-button",{attrs:{type:"primary"}},[a("a-icon",{attrs:{type:"left"}}),t._v("Backward ")],1),t._v(" "),a("a-button",{attrs:{type:"primary"}},[t._v(" Forward"),a("a-icon",{attrs:{type:"right"}})],1)],1)],1)]),t._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"按钮尺寸"}},[t._v("按钮尺寸 "),a("a",{staticClass:"anchor",attrs:{href:"#按钮尺寸"}},[t._v("#")])]),t._v(" "),a("p",[t._v("按钮有大、中、小三种尺寸。"),a("br"),t._v("\n通过设置 "),a("code",[t._v("size")]),t._v(" 为 "),a("code",[t._v("large")]),t._v(" "),a("code",[t._v("small")]),t._v(" 分别把按钮设为大、小尺寸。若不设置 "),a("code",[t._v("size")]),t._v("，则尺寸为中。"),a("br")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Size"}},[t._v("Size "),a("a",{staticClass:"anchor",attrs:{href:"#Size"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Ant Design supports a default button size as well as a large and small size."),a("br"),t._v("\nIf a large or small button is desired, set the "),a("code",[t._v("size")]),t._v(" property to either "),a("code",[t._v("large")]),t._v(" or "),a("code",[t._v("small")]),t._v(" respectively. Omit the "),a("code",[t._v("size")]),t._v(" property for a button with the default size."),a("br")])]),t._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-radio-group")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleSizeChange"')]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-radio-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"large"')]),t._v(">")]),t._v("Large"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-radio-button")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-radio-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"default"')]),t._v(">")]),t._v("Default"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-radio-button")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-radio-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"small"')]),t._v(">")]),t._v("Small"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-radio-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-radio-group")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("br")]),t._v(" />")]),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("br")]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v(">")]),t._v("Primary"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v(">")]),t._v("Normal"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"dashed"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v(">")]),t._v("Dashed"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"danger"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v(">")]),t._v("Danger"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"link"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v(">")]),t._v("Link"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("br")]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("shape")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"circle"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"download"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("shape")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"round"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"download"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v(">")]),t._v("Download"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("icon")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"download"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v(">")]),t._v("Download"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("br")]),t._v(" />")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(">")]),t._v(" "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-icon")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"left"')]),t._v(" />")]),t._v("Backward "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n      "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(">")]),t._v(" Forward"),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-icon")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"right"')]),t._v(" />")]),t._v(" "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button-group")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),a("span",{staticClass:"javascript"},[t._v("\n  "),a("span",{staticClass:"hljs-keyword"},[t._v("export")]),t._v(" "),a("span",{staticClass:"hljs-keyword"},[t._v("default")]),t._v(" {\n    data() {\n      "),a("span",{staticClass:"hljs-keyword"},[t._v("return")]),t._v(" {\n        "),a("span",{staticClass:"hljs-attr"},[t._v("size")]),t._v(": "),a("span",{staticClass:"hljs-string"},[t._v("'large'")]),t._v(",\n      };\n    },\n    "),a("span",{staticClass:"hljs-attr"},[t._v("methods")]),t._v(": {\n      handleSizeChange(e) {\n        "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".size = e.target.value;\n      },\n    },\n  };\n")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),t._v("\n")])])])],2)]],2)};L._withStripped=!0;var x={data:function(){return{size:"large"}},methods:{handleSizeChange:function(t){this.size=t.target.value}}},B=Object(l.a)(x,L,[],!1,null,null,null);B.options.__file="components/button/demo/size.md";var I=B.exports,S=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n  <div>\n    <a-button type="primary" block="">Primary</a-button>\n    <a-button block="">Default</a-button>\n    <a-button type="dashed" block="">Dashed</a-button>\n    <a-button type="danger" block="">Danger</a-button>\n    <a-button type="link" block="">Link</a-button>\n  </div>\n',script:null,style:null,us:"\n#### block Button\n`block` property will make the button fit to its parent width.\n",cn:"\n#### block 按钮\n`block`属性将使按钮适合其父宽度。\n",sourceCode:'<template>\n  <div>\n    <a-button type="primary" block>Primary</a-button>\n    <a-button block>Default</a-button>\n    <a-button type="dashed" block>Dashed</a-button>\n    <a-button type="danger" block>Danger</a-button>\n    <a-button type="link" block>Link</a-button>\n  </div>\n</template>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-button",{attrs:{type:"primary",block:""}},[t._v("Primary")]),t._v(" "),a("a-button",{attrs:{block:""}},[t._v("Default")]),t._v(" "),a("a-button",{attrs:{type:"dashed",block:""}},[t._v("Dashed")]),t._v(" "),a("a-button",{attrs:{type:"danger",block:""}},[t._v("Danger")]),t._v(" "),a("a-button",{attrs:{type:"link",block:""}},[t._v("Link")])],1)]),t._v(" "),a("template",{slot:"description"},[a("h4",{attrs:{id:"block-按钮"}},[t._v("block 按钮 "),a("a",{staticClass:"anchor",attrs:{href:"#block-按钮"}},[t._v("#")])]),t._v(" "),a("p",[a("code",[t._v("block")]),t._v("属性将使按钮适合其父宽度。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"block-Button"}},[t._v("block Button "),a("a",{staticClass:"anchor",attrs:{href:"#block-Button"}},[t._v("#")])]),t._v(" "),a("p",[a("code",[t._v("block")]),t._v(" property will make the button fit to its parent width.")])]),t._v(" "),a("template",{slot:"code"},[a("pre",[a("code",{staticClass:"language-html"},[a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"primary"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("block")]),t._v(">")]),t._v("Primary"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("block")]),t._v(">")]),t._v("Default"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"dashed"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("block")]),t._v(">")]),t._v("Dashed"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"danger"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("block")]),t._v(">")]),t._v("Danger"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n    "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"link"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("block")]),t._v(">")]),t._v("Link"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-button")]),t._v(">")]),t._v("\n  "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("div")]),t._v(">")]),t._v("\n"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n")])])])],2)]],2)};S._withStripped=!0;var P=Object(l.a)({},S,[],!1,null,null,null);P.options.__file="components/button/demo/block.md";var G=P.exports,M=function(){var t=this.$createElement;this._self._c;return this._m(0)};M._withStripped=!0;var A=Object(l.a)({},M,[function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[a("h2",{attrs:{id:"API"}},[t._v("API "),a("a",{staticClass:"anchor",attrs:{href:"#API"}},[t._v("#")])]),t._v(" "),a("p",[t._v("通过设置 Button 的属性来产生不同的按钮样式，推荐顺序为："),a("code",{pre:!0},[t._v("type")]),t._v(" -> "),a("code",{pre:!0},[t._v("shape")]),t._v(" -> "),a("code",{pre:!0},[t._v("size")]),t._v(" -> "),a("code",{pre:!0},[t._v("loading")]),t._v(" -> "),a("code",{pre:!0},[t._v("disabled")]),t._v("。")]),t._v(" "),a("p",[t._v("按钮的属性说明如下：")]),t._v(" "),a("table",[a("thead",[a("tr",[a("th",[t._v("属性")]),t._v(" "),a("th",[t._v("说明")]),t._v(" "),a("th",[t._v("类型")]),t._v(" "),a("th",[t._v("默认值")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("disabled")]),t._v(" "),a("td",[t._v("按钮失效状态")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("false")])])]),t._v(" "),a("tr",[a("td",[t._v("ghost")]),t._v(" "),a("td",[t._v("幽灵属性，使按钮背景透明")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("htmlType")]),t._v(" "),a("td",[t._v("设置 "),a("code",{pre:!0},[t._v("button")]),t._v(" 原生的 "),a("code",{pre:!0},[t._v("type")]),t._v(" 值，可选值请参考 "),a("a",{attrs:{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type"}},[t._v("HTML 标准")])]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("button")])])]),t._v(" "),a("tr",[a("td",[t._v("icon")]),t._v(" "),a("td",[t._v("设置按钮的图标类型")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("loading")]),t._v(" "),a("td",[t._v("设置按钮载入状态")]),t._v(" "),a("td",[t._v("boolean | { delay: number }")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("false")])])]),t._v(" "),a("tr",[a("td",[t._v("shape")]),t._v(" "),a("td",[t._v("设置按钮形状，可选值为 "),a("code",{pre:!0},[t._v("circle")]),t._v("、 "),a("code",{pre:!0},[t._v("round")]),t._v(" 或者不设")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("size")]),t._v(" "),a("td",[t._v("设置按钮大小，可选值为 "),a("code",{pre:!0},[t._v("small")]),t._v(" "),a("code",{pre:!0},[t._v("large")]),t._v(" 或者不设")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("default")])])]),t._v(" "),a("tr",[a("td",[t._v("type")]),t._v(" "),a("td",[t._v("设置按钮类型，可选值为 "),a("code",{pre:!0},[t._v("primary")]),t._v(" "),a("code",{pre:!0},[t._v("dashed")]),t._v(" "),a("code",{pre:!0},[t._v("danger")]),t._v(" "),a("code",{pre:!0},[t._v("link")]),t._v(" 或者不设")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("default")])])]),t._v(" "),a("tr",[a("td",[t._v("block")]),t._v(" "),a("td",[t._v("将按钮宽度调整为其父宽度的选项")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("false")])])])])]),t._v(" "),a("h3",{attrs:{id:"事件"}},[t._v("事件 "),a("a",{staticClass:"anchor",attrs:{href:"#事件"}},[t._v("#")])]),t._v(" "),a("table",[a("thead",[a("tr",[a("th",[t._v("事件名称")]),t._v(" "),a("th",[t._v("说明")]),t._v(" "),a("th",[t._v("回调参数")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("click")]),t._v(" "),a("td",[t._v("点击按钮时的回调")]),t._v(" "),a("td",[t._v("(event) => void")])])])]),t._v(" "),a("p",[a("code",{pre:!0},[t._v("<a-button>Hello world!</a-button>")]),t._v(" 最终会被渲染为 "),a("code",{pre:!0},[t._v("<button><span>Hello world!</span></button>")]),t._v("，并且除了上表中的属性，其它属性都会直接传到原生 button 上。 "),a("code",{pre:!0},[t._v('<Button href="http://example.com">Hello world!</Button>')]),t._v(" 则会渲染为 "),a("code",{pre:!0},[t._v('<a href="http://example.com"><span>Hello world!</span></a>')]),t._v("。")]),t._v(" "),a("h2",{attrs:{id:"FAQ"}},[t._v("FAQ "),a("a",{staticClass:"anchor",attrs:{href:"#FAQ"}},[t._v("#")])]),t._v(" "),a("h3",{attrs:{id:"如何移除-2-个汉字之间的空格"}},[t._v("如何移除 2 个汉字之间的空格 "),a("a",{staticClass:"anchor",attrs:{href:"#如何移除-2-个汉字之间的空格"}},[t._v("#")])]),t._v(" "),a("p",[t._v("设置 "),a("a",{attrs:{href:"/components/config-provider/#API"}},[t._v("ConfigProvider")]),t._v(" 的 "),a("code",{pre:!0},[t._v("autoInsertSpaceInButton")]),t._v(" 为 "),a("code",{pre:!0},[t._v("false")]),t._v("。")])])}],!1,null,null,null);A.options.__file="components/button/index.zh-CN.md";var T=A.exports,O=function(){var t=this.$createElement;this._self._c;return this._m(0)};O._withStripped=!0;var E=Object(l.a)({},O,[function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[a("h2",{attrs:{id:"API"}},[t._v("API "),a("a",{staticClass:"anchor",attrs:{href:"#API"}},[t._v("#")])]),t._v(" "),a("p",[t._v("To get a customized button, just set "),a("code",{pre:!0},[t._v("type")]),t._v("/"),a("code",{pre:!0},[t._v("shape")]),t._v("/"),a("code",{pre:!0},[t._v("size")]),t._v("/"),a("code",{pre:!0},[t._v("loading")]),t._v("/"),a("code",{pre:!0},[t._v("disabled")]),t._v(".")]),t._v(" "),a("table",[a("thead",[a("tr",[a("th",[t._v("Property")]),t._v(" "),a("th",[t._v("Description")]),t._v(" "),a("th",[t._v("Type")]),t._v(" "),a("th",[t._v("Default")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("disabled")]),t._v(" "),a("td",[t._v("disabled state of button")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("false")])])]),t._v(" "),a("tr",[a("td",[t._v("ghost")]),t._v(" "),a("td",[t._v("make background transparent and invert text and border colors, added in 2.7")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("htmlType")]),t._v(" "),a("td",[t._v("set the original html "),a("code",{pre:!0},[t._v("type")]),t._v(" of "),a("code",{pre:!0},[t._v("button")]),t._v(", see: "),a("a",{attrs:{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type"}},[t._v("MDN")])]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("button")])])]),t._v(" "),a("tr",[a("td",[t._v("icon")]),t._v(" "),a("td",[t._v("set the icon of button, see: Icon component")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("loading")]),t._v(" "),a("td",[t._v("set the loading status of button")]),t._v(" "),a("td",[t._v("boolean | { delay: number }")]),t._v(" "),a("td",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("shape")]),t._v(" "),a("td",[t._v("can be set to "),a("code",{pre:!0},[t._v("circle")]),t._v(", "),a("code",{pre:!0},[t._v("round")]),t._v(" or omitted")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("size")]),t._v(" "),a("td",[t._v("can be set to "),a("code",{pre:!0},[t._v("small")]),t._v(" "),a("code",{pre:!0},[t._v("large")]),t._v(" or omitted")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("default")])])]),t._v(" "),a("tr",[a("td",[t._v("type")]),t._v(" "),a("td",[t._v("can be set to "),a("code",{pre:!0},[t._v("primary")]),t._v(" "),a("code",{pre:!0},[t._v("ghost")]),t._v(" "),a("code",{pre:!0},[t._v("dashed")]),t._v(" "),a("code",{pre:!0},[t._v("danger")]),t._v(" "),a("code",{pre:!0},[t._v("link")]),t._v(" or omitted (meaning "),a("code",{pre:!0},[t._v("default")]),t._v(")")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("default")])])]),t._v(" "),a("tr",[a("td",[t._v("block")]),t._v(" "),a("td",[t._v("option to fit button width to its parent width")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("false")])])])])]),t._v(" "),a("h3",{attrs:{id:"events"}},[t._v("events "),a("a",{staticClass:"anchor",attrs:{href:"#events"}},[t._v("#")])]),t._v(" "),a("table",[a("thead",[a("tr",[a("th",[t._v("Events Name")]),t._v(" "),a("th",[t._v("Description")]),t._v(" "),a("th",[t._v("Arguments")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("click")]),t._v(" "),a("td",[t._v("set the handler to handle "),a("code",{pre:!0},[t._v("click")]),t._v(" event")]),t._v(" "),a("td",[t._v("(event) => void")])])])]),t._v(" "),a("p",[a("code",{pre:!0},[t._v("<Button>Hello world!</Button>")]),t._v(" will be rendered into "),a("code",{pre:!0},[t._v("<button><span>Hello world!</span></button>")]),t._v(", and all the properties which are not listed above will be transferred to the "),a("code",{pre:!0},[t._v("<button>")]),t._v(" tag. "),a("code",{pre:!0},[t._v('<Button href="http://example.com">Hello world!</Button>')]),t._v(" will be rendered into "),a("code",{pre:!0},[t._v('<a href="http://example.com"><span>Hello world!</span></a>')]),t._v(".")]),t._v(" "),a("h2",{attrs:{id:"FAQ"}},[t._v("FAQ "),a("a",{staticClass:"anchor",attrs:{href:"#FAQ"}},[t._v("#")])]),t._v(" "),a("h3",{attrs:{id:"How-to-remove-space-between-2-chinese-characters"}},[t._v("How to remove space between 2 chinese characters "),a("a",{staticClass:"anchor",attrs:{href:"#How-to-remove-space-between-2-chinese-characters"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Use "),a("a",{attrs:{href:"/components/config-provider/#API"}},[t._v("ConfigProvider")]),t._v(" to set "),a("code",{pre:!0},[t._v("autoInsertSpaceInButton")]),t._v(" as "),a("code",{pre:!0},[t._v("false")]),t._v(".")])])}],!1,null,null,null);E.options.__file="components/button/index.en-US.md";var H=E.exports,$="# Button 按钮\n          按钮用于开始一个即时操作。\n          ## 何时使用\n          标记了一个（或封装一组）操作命令，响应用户点击行为，触发相应的业务逻辑。\n          ## 组件注册\n          ```js\n          import { Button } from 'ant-design-vue';\n          Vue.use(Button);\n          ```\n          ## 代码演示",F="# Button\n          To trigger an operation.\n          ## When To Use\n          A button means an operation (or a series of operations). Clicking a button will trigger corresponding business logic.\n          ## Component Registration\n          ```js\n          import { Button } from 'ant-design-vue';\n          Vue.use(Button);\n          ```\n          ## Examples\n          ",R={category:"Components",type:"General",zhType:"通用",title:"Button",subtitle:"按钮",render:function(){var t=arguments[0];return t("div",[t("md",{attrs:{cn:$,us:F}}),t(v),t(o),t(c),t(u),t(m),t(f),t(D),t(I),t(G),t("api",[t(T,{slot:"cn"}),t(H)])])}},N=(a(1296),Object(l.a)(R,void 0,void 0,!1,null,null,null));N.options.__file="components/button/demo/index.vue";s.default=N.exports}}]);