1 line
87 KiB
JavaScript
1 line
87 KiB
JavaScript
(window.webpackJsonp=window.webpackJsonp||[]).push([[20],{1220:function(s,t,a){},1316:function(s,t,a){"use strict";var n=a(1220);a.n(n).a},1436: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-dropdown>\n <a class="ant-dropdown-link" href="#"> Hover me <a-icon type="down"/> </a>\n <a-menu slot="overlay">\n <a-menu-item>\n <a href="javascript:;">1st menu item</a>\n </a-menu-item>\n <a-menu-item>\n <a href="javascript:;">2nd menu item</a>\n </a-menu-item>\n <a-menu-item>\n <a href="javascript:;">3rd menu item</a>\n </a-menu-item>\n </a-menu>\n </a-dropdown>\n',script:null,style:null,us:"\n#### Basic\nThe most basic dropdown menu.\n",cn:"\n#### 基本\n最简单的下拉菜单。\n",sourceCode:'<template>\n <a-dropdown>\n <a class="ant-dropdown-link" href="#"> Hover me <a-icon type="down" /> </a>\n <a-menu slot="overlay">\n <a-menu-item>\n <a href="javascript:;">1st menu item</a>\n </a-menu-item>\n <a-menu-item>\n <a href="javascript:;">2nd menu item</a>\n </a-menu-item>\n <a-menu-item>\n <a href="javascript:;">3rd menu item</a>\n </a-menu-item>\n </a-menu>\n </a-dropdown>\n</template>\n'}}},[a("template",{slot:"component"},[a("a-dropdown",[a("a",{staticClass:"ant-dropdown-link",attrs:{href:"#"}},[s._v(" Hover me "),a("a-icon",{attrs:{type:"down"}})],1),s._v(" "),a("a-menu",{attrs:{slot:"overlay"},slot:"overlay"},[a("a-menu-item",[a("a",{attrs:{href:"javascript:;"}},[s._v("1st menu item")])]),s._v(" "),a("a-menu-item",[a("a",{attrs:{href:"javascript:;"}},[s._v("2nd menu item")])]),s._v(" "),a("a-menu-item",[a("a",{attrs:{href:"javascript:;"}},[s._v("3rd menu item")])])],1)],1)],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 most basic dropdown menu.")])]),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-dropdown")]),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("class")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"ant-dropdown-link"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"#"')]),s._v(">")]),s._v(" Hover me "),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"down"')]),s._v(" />")]),s._v(" "),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-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"overlay"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),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('"javascript:;"')]),s._v(">")]),s._v("1st menu item"),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-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),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('"javascript:;"')]),s._v(">")]),s._v("2nd menu item"),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-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),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('"javascript:;"')]),s._v(">")]),s._v("3rd menu item"),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-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown")]),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)};n._withStripped=!0;var e=a(31),l=Object(e.a)({},n,[],!1,null,null,null);l.options.__file="components/dropdown/demo/basic.md";var v=l.exports,i=function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-dropdown :trigger="[\'contextmenu\']">\n <span style="user-select: none">Right Click on Me</span>\n <a-menu slot="overlay">\n <a-menu-item key="1">1st menu item</a-menu-item>\n <a-menu-item key="2">2nd menu item</a-menu-item>\n <a-menu-item key="3">3rd menu item</a-menu-item>\n </a-menu>\n </a-dropdown>\n',script:null,style:null,us:"\n#### Context Menu\nThe default trigger mode is `hover`, you can change it to `contextMenu`.\n",cn:"\n#### 右键菜单\n默认是移入触发菜单,可以点击鼠标右键触发。\n",sourceCode:'<template>\n <a-dropdown :trigger="[\'contextmenu\']">\n <span style="user-select: none">Right Click on Me</span>\n <a-menu slot="overlay">\n <a-menu-item key="1">1st menu item</a-menu-item>\n <a-menu-item key="2">2nd menu item</a-menu-item>\n <a-menu-item key="3">3rd menu item</a-menu-item>\n </a-menu>\n </a-dropdown>\n</template>\n'}}},[a("template",{slot:"component"},[a("a-dropdown",{attrs:{trigger:["contextmenu"]}},[a("span",{staticStyle:{"user-select":"none"}},[s._v("Right Click on Me")]),s._v(" "),a("a-menu",{attrs:{slot:"overlay"},slot:"overlay"},[a("a-menu-item",{key:"1"},[s._v("1st menu item")]),s._v(" "),a("a-menu-item",{key:"2"},[s._v("2nd menu item")]),s._v(" "),a("a-menu-item",{key:"3"},[s._v("3rd menu item")])],1)],1)],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:"Context-Menu"}},[s._v("Context Menu "),a("a",{staticClass:"anchor",attrs:{href:"#Context-Menu"}},[s._v("#")])]),s._v(" "),a("p",[s._v("The default trigger mode is "),a("code",[s._v("hover")]),s._v(", you can change it to "),a("code",[s._v("contextMenu")]),s._v(".")])]),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-dropdown")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v(":trigger")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v("\"['contextmenu']\"")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("span")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("style")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"user-select: none"')]),s._v(">")]),s._v("Right Click on Me"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("span")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"overlay"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"1"')]),s._v(">")]),s._v("1st menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"2"')]),s._v(">")]),s._v("2nd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"3"')]),s._v(">")]),s._v("3rd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown")]),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)};i._withStripped=!0;var _=Object(e.a)({},i,[],!1,null,null,null);_.options.__file="components/dropdown/demo/context-menu.md";var m=_.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>\n <a-dropdown-button @click="handleButtonClick">\n Dropdown\n <a-menu slot="overlay" @click="handleMenuClick">\n <a-menu-item key="1"><a-icon type="user"/>1st menu item</a-menu-item>\n <a-menu-item key="2"><a-icon type="user"/>2nd menu item</a-menu-item>\n <a-menu-item key="3"><a-icon type="user"/>3rd item</a-menu-item>\n </a-menu>\n </a-dropdown-button>\n <a-dropdown-button @click="handleButtonClick" disabled="" style="margin-left: 8px">\n Dropdown\n <a-menu slot="overlay" @click="handleMenuClick">\n <a-menu-item key="1"><a-icon type="user"/>1st menu item</a-menu-item>\n <a-menu-item key="2"><a-icon type="user"/>2nd menu item</a-menu-item>\n <a-menu-item key="3"><a-icon type="user"/>3rd item</a-menu-item>\n </a-menu>\n </a-dropdown-button>\n <a-dropdown>\n <a-menu slot="overlay" @click="handleMenuClick">\n <a-menu-item key="1"><a-icon type="user"/>1st menu item</a-menu-item>\n <a-menu-item key="2"><a-icon type="user"/>2nd menu item</a-menu-item>\n <a-menu-item key="3"><a-icon type="user"/>3rd item</a-menu-item>\n </a-menu>\n <a-button style="margin-left: 8px"> Button <a-icon type="down"/> </a-button>\n </a-dropdown>\n </div>\n',script:"\n export default {\n methods: {\n handleButtonClick(e) {\n console.log('click left button', e);\n },\n handleMenuClick(e) {\n console.log('click', e);\n },\n },\n };\n",style:null,us:"\n#### Button with dropdown menu\nA button is on the left, and a related functional menu is on the right.\n",cn:"\n#### 带下拉框的按钮\n左边是按钮,右边是额外的相关功能菜单。\n",sourceCode:'<template>\n <div>\n <a-dropdown-button @click="handleButtonClick">\n Dropdown\n <a-menu slot="overlay" @click="handleMenuClick">\n <a-menu-item key="1"><a-icon type="user" />1st menu item</a-menu-item>\n <a-menu-item key="2"><a-icon type="user" />2nd menu item</a-menu-item>\n <a-menu-item key="3"><a-icon type="user" />3rd item</a-menu-item>\n </a-menu>\n </a-dropdown-button>\n <a-dropdown-button @click="handleButtonClick" disabled style="margin-left: 8px">\n Dropdown\n <a-menu slot="overlay" @click="handleMenuClick">\n <a-menu-item key="1"><a-icon type="user" />1st menu item</a-menu-item>\n <a-menu-item key="2"><a-icon type="user" />2nd menu item</a-menu-item>\n <a-menu-item key="3"><a-icon type="user" />3rd item</a-menu-item>\n </a-menu>\n </a-dropdown-button>\n <a-dropdown>\n <a-menu slot="overlay" @click="handleMenuClick">\n <a-menu-item key="1"><a-icon type="user" />1st menu item</a-menu-item>\n <a-menu-item key="2"><a-icon type="user" />2nd menu item</a-menu-item>\n <a-menu-item key="3"><a-icon type="user" />3rd item</a-menu-item>\n </a-menu>\n <a-button style="margin-left: 8px"> Button <a-icon type="down" /> </a-button>\n </a-dropdown>\n </div>\n</template>\n\n<script>\n export default {\n methods: {\n handleButtonClick(e) {\n console.log(\'click left button\', e);\n },\n handleMenuClick(e) {\n console.log(\'click\', e);\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-dropdown-button",{on:{click:s.handleButtonClick}},[s._v("\n Dropdown\n "),a("a-menu",{attrs:{slot:"overlay"},on:{click:s.handleMenuClick},slot:"overlay"},[a("a-menu-item",{key:"1"},[a("a-icon",{attrs:{type:"user"}}),s._v("1st menu item")],1),s._v(" "),a("a-menu-item",{key:"2"},[a("a-icon",{attrs:{type:"user"}}),s._v("2nd menu item")],1),s._v(" "),a("a-menu-item",{key:"3"},[a("a-icon",{attrs:{type:"user"}}),s._v("3rd item")],1)],1)],1),s._v(" "),a("a-dropdown-button",{staticStyle:{"margin-left":"8px"},attrs:{disabled:""},on:{click:s.handleButtonClick}},[s._v("\n Dropdown\n "),a("a-menu",{attrs:{slot:"overlay"},on:{click:s.handleMenuClick},slot:"overlay"},[a("a-menu-item",{key:"1"},[a("a-icon",{attrs:{type:"user"}}),s._v("1st menu item")],1),s._v(" "),a("a-menu-item",{key:"2"},[a("a-icon",{attrs:{type:"user"}}),s._v("2nd menu item")],1),s._v(" "),a("a-menu-item",{key:"3"},[a("a-icon",{attrs:{type:"user"}}),s._v("3rd item")],1)],1)],1),s._v(" "),a("a-dropdown",[a("a-menu",{attrs:{slot:"overlay"},on:{click:s.handleMenuClick},slot:"overlay"},[a("a-menu-item",{key:"1"},[a("a-icon",{attrs:{type:"user"}}),s._v("1st menu item")],1),s._v(" "),a("a-menu-item",{key:"2"},[a("a-icon",{attrs:{type:"user"}}),s._v("2nd menu item")],1),s._v(" "),a("a-menu-item",{key:"3"},[a("a-icon",{attrs:{type:"user"}}),s._v("3rd item")],1)],1),s._v(" "),a("a-button",{staticStyle:{"margin-left":"8px"}},[s._v(" Button "),a("a-icon",{attrs:{type:"down"}})],1)],1)],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:"Button-with-dropdown-menu"}},[s._v("Button with dropdown menu "),a("a",{staticClass:"anchor",attrs:{href:"#Button-with-dropdown-menu"}},[s._v("#")])]),s._v(" "),a("p",[s._v("A button is on the left, and a related functional menu is on the right.")])]),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-dropdown-button")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@click")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"handleButtonClick"')]),s._v(">")]),s._v("\n Dropdown\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"overlay"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@click")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"handleMenuClick"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"1"')]),s._v(">")]),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"user"')]),s._v(" />")]),s._v("1st menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"2"')]),s._v(">")]),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"user"')]),s._v(" />")]),s._v("2nd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"3"')]),s._v(">")]),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"user"')]),s._v(" />")]),s._v("3rd item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown-button")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@click")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"handleButtonClick"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("disabled")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("style")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"margin-left: 8px"')]),s._v(">")]),s._v("\n Dropdown\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"overlay"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@click")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"handleMenuClick"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"1"')]),s._v(">")]),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"user"')]),s._v(" />")]),s._v("1st menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"2"')]),s._v(">")]),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"user"')]),s._v(" />")]),s._v("2nd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"3"')]),s._v(">")]),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"user"')]),s._v(" />")]),s._v("3rd item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown-button")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"overlay"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@click")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"handleMenuClick"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"1"')]),s._v(">")]),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"user"')]),s._v(" />")]),s._v("1st menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"2"')]),s._v(">")]),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"user"')]),s._v(" />")]),s._v("2nd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"3"')]),s._v(">")]),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"user"')]),s._v(" />")]),s._v("3rd item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("style")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"margin-left: 8px"')]),s._v(">")]),s._v(" Button "),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"down"')]),s._v(" />")]),s._v(" "),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-dropdown")]),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\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 handleButtonClick(e) {\n "),a("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log("),a("span",{staticClass:"hljs-string"},[s._v("'click left button'")]),s._v(", e);\n },\n handleMenuClick(e) {\n "),a("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log("),a("span",{staticClass:"hljs-string"},[s._v("'click'")]),s._v(", e);\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)};o._withStripped=!0;var c={methods:{handleButtonClick:function(s){console.log("click left button",s)},handleMenuClick:function(s){console.log("click",s)}}},r=Object(e.a)(c,o,[],!1,null,null,null);r.options.__file="components/dropdown/demo/dropdown-button.md";var p=r.exports,h=function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-dropdown>\n <a class="ant-dropdown-link" href="#"> Hover me, Click menu item <a-icon type="down"/> </a>\n <a-menu slot="overlay" @click="onClick">\n <a-menu-item key="1">1st menu item</a-menu-item>\n <a-menu-item key="2">2nd menu item</a-menu-item>\n <a-menu-item key="3">3rd menu item</a-menu-item>\n </a-menu>\n </a-dropdown>\n',script:"\n export default {\n methods: {\n onClick({ key }) {\n console.log(`Click on item ${key}`);\n },\n },\n };\n",style:null,us:"\n#### Click event\nAn event will be triggered when you click menu items, in which you can make different operations according to item's key.\n",cn:"\n#### 触发事件\n点击菜单项后会触发事件,用户可以通过相应的菜单项 key 进行不同的操作。\n",sourceCode:'<template>\n <a-dropdown>\n <a class="ant-dropdown-link" href="#"> Hover me, Click menu item <a-icon type="down" /> </a>\n <a-menu slot="overlay" @click="onClick">\n <a-menu-item key="1">1st menu item</a-menu-item>\n <a-menu-item key="2">2nd menu item</a-menu-item>\n <a-menu-item key="3">3rd menu item</a-menu-item>\n </a-menu>\n </a-dropdown>\n</template>\n\n<script>\n export default {\n methods: {\n onClick({ key }) {\n console.log(`Click on item ${key}`);\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-dropdown",[a("a",{staticClass:"ant-dropdown-link",attrs:{href:"#"}},[s._v(" Hover me, Click menu item "),a("a-icon",{attrs:{type:"down"}})],1),s._v(" "),a("a-menu",{attrs:{slot:"overlay"},on:{click:s.onClick},slot:"overlay"},[a("a-menu-item",{key:"1"},[s._v("1st menu item")]),s._v(" "),a("a-menu-item",{key:"2"},[s._v("2nd menu item")]),s._v(" "),a("a-menu-item",{key:"3"},[s._v("3rd menu item")])],1)],1)],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("点击菜单项后会触发事件,用户可以通过相应的菜单项 key 进行不同的操作。")])]),s._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Click-event"}},[s._v("Click event "),a("a",{staticClass:"anchor",attrs:{href:"#Click-event"}},[s._v("#")])]),s._v(" "),a("p",[s._v("An event will be triggered when you click menu items, in which you can make different operations according to item's key.")])]),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-dropdown")]),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("class")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"ant-dropdown-link"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"#"')]),s._v(">")]),s._v(" Hover me, Click menu item "),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"down"')]),s._v(" />")]),s._v(" "),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-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"overlay"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@click")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"onClick"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"1"')]),s._v(">")]),s._v("1st menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"2"')]),s._v(">")]),s._v("2nd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"3"')]),s._v(">")]),s._v("3rd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown")]),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\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 onClick({ key }) {\n "),a("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log("),a("span",{staticClass:"hljs-string"},[s._v("`Click on item "),a("span",{staticClass:"hljs-subst"},[s._v("${key}")]),s._v("`")]),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)};h._withStripped=!0;var d={methods:{onClick:function(s){var t=s.key;console.log("Click on item "+t)}}},u=Object(e.a)(d,h,[],!1,null,null,null);u.options.__file="components/dropdown/demo/event.md";var C=u.exports,j=function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-dropdown>\n <a class="ant-dropdown-link" href="#"> Hover me <a-icon type="down"/> </a>\n <a-menu slot="overlay">\n <a-menu-item key="0">\n <a target="_blank" rel="noopener noreferrer" href="http://www.alipay.com/">1st menu item</a>\n </a-menu-item>\n <a-menu-item key="1">\n <a target="_blank" rel="noopener noreferrer" href="http://www.taobao.com/">2nd menu item</a>\n </a-menu-item>\n <a-menu-divider/>\n <a-menu-item key="3" disabled="">3rd menu item(disabled)</a-menu-item>\n </a-menu>\n </a-dropdown>\n',script:null,style:null,us:"\n#### Other elements\nDivider and disabled menu item.\n",cn:"\n#### 其他元素\n分割线和不可用菜单项。\n",sourceCode:'<template>\n <a-dropdown>\n <a class="ant-dropdown-link" href="#"> Hover me <a-icon type="down" /> </a>\n <a-menu slot="overlay">\n <a-menu-item key="0">\n <a target="_blank" rel="noopener noreferrer" href="http://www.alipay.com/">1st menu item</a>\n </a-menu-item>\n <a-menu-item key="1">\n <a target="_blank" rel="noopener noreferrer" href="http://www.taobao.com/">2nd menu item</a>\n </a-menu-item>\n <a-menu-divider />\n <a-menu-item key="3" disabled>3rd menu item(disabled)</a-menu-item>\n </a-menu>\n </a-dropdown>\n</template>\n'}}},[a("template",{slot:"component"},[a("a-dropdown",[a("a",{staticClass:"ant-dropdown-link",attrs:{href:"#"}},[s._v(" Hover me "),a("a-icon",{attrs:{type:"down"}})],1),s._v(" "),a("a-menu",{attrs:{slot:"overlay"},slot:"overlay"},[a("a-menu-item",{key:"0"},[a("a",{attrs:{target:"_blank",rel:"noopener noreferrer",href:"http://www.alipay.com/"}},[s._v("1st menu item")])]),s._v(" "),a("a-menu-item",{key:"1"},[a("a",{attrs:{target:"_blank",rel:"noopener noreferrer",href:"http://www.taobao.com/"}},[s._v("2nd menu item")])]),s._v(" "),a("a-menu-divider"),s._v(" "),a("a-menu-item",{key:"3",attrs:{disabled:""}},[s._v("3rd menu item(disabled)")])],1)],1)],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:"Other-elements"}},[s._v("Other elements "),a("a",{staticClass:"anchor",attrs:{href:"#Other-elements"}},[s._v("#")])]),s._v(" "),a("p",[s._v("Divider and disabled menu item.")])]),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-dropdown")]),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("class")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"ant-dropdown-link"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"#"')]),s._v(">")]),s._v(" Hover me "),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"down"')]),s._v(" />")]),s._v(" "),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-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"overlay"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"0"')]),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("target")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"_blank"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("rel")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"noopener noreferrer"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"http://www.alipay.com/"')]),s._v(">")]),s._v("1st menu item"),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-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"1"')]),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("target")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"_blank"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("rel")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"noopener noreferrer"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"http://www.taobao.com/"')]),s._v(">")]),s._v("2nd menu item"),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-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-divider")]),s._v(" />")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"3"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("disabled")]),s._v(">")]),s._v("3rd menu item(disabled)"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown")]),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)};j._withStripped=!0;var g=Object(e.a)({},j,[],!1,null,null,null);g.options.__file="components/dropdown/demo/item.md";var w=g.exports,y=function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-dropdown v-model="visible">\n <a class="ant-dropdown-link" href="#"> Hover me <a-icon type="down"/> </a>\n <a-menu slot="overlay" @click="handleMenuClick">\n <a-menu-item key="1">Clicking me will not close the menu.</a-menu-item>\n <a-menu-item key="2">Clicking me will not close the menu also.</a-menu-item>\n <a-menu-item key="3">Clicking me will close the menu</a-menu-item>\n </a-menu>\n </a-dropdown>\n',script:"\n export default {\n data() {\n return {\n visible: false,\n };\n },\n methods: {\n handleMenuClick(e) {\n if (e.key === '3') {\n this.visible = false;\n }\n },\n },\n };\n",style:null,us:"\n#### The way of hiding menu.\nThe default is to close the menu when you click on menu items, this feature can be turned off.\n",cn:"\n#### 菜单隐藏方式\n默认是点击关闭菜单,可以关闭此功能。\n",sourceCode:'<template>\n <a-dropdown v-model="visible">\n <a class="ant-dropdown-link" href="#"> Hover me <a-icon type="down" /> </a>\n <a-menu slot="overlay" @click="handleMenuClick">\n <a-menu-item key="1">Clicking me will not close the menu.</a-menu-item>\n <a-menu-item key="2">Clicking me will not close the menu also.</a-menu-item>\n <a-menu-item key="3">Clicking me will close the menu</a-menu-item>\n </a-menu>\n </a-dropdown>\n</template>\n\n<script>\n export default {\n data() {\n return {\n visible: false,\n };\n },\n methods: {\n handleMenuClick(e) {\n if (e.key === \'3\') {\n this.visible = false;\n }\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-dropdown",{model:{value:s.visible,callback:function(t){s.visible=t},expression:"visible"}},[a("a",{staticClass:"ant-dropdown-link",attrs:{href:"#"}},[s._v(" Hover me "),a("a-icon",{attrs:{type:"down"}})],1),s._v(" "),a("a-menu",{attrs:{slot:"overlay"},on:{click:s.handleMenuClick},slot:"overlay"},[a("a-menu-item",{key:"1"},[s._v("Clicking me will not close the menu.")]),s._v(" "),a("a-menu-item",{key:"2"},[s._v("Clicking me will not close the menu also.")]),s._v(" "),a("a-menu-item",{key:"3"},[s._v("Clicking me will close the menu")])],1)],1)],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:"The-way-of-hiding-menu."}},[s._v("The way of hiding menu. "),a("a",{staticClass:"anchor",attrs:{href:"#The-way-of-hiding-menu."}},[s._v("#")])]),s._v(" "),a("p",[s._v("The default is to close the menu when you click on menu items, this feature can be turned off.")])]),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-dropdown")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("v-model")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"visible"')]),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("class")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"ant-dropdown-link"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"#"')]),s._v(">")]),s._v(" Hover me "),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"down"')]),s._v(" />")]),s._v(" "),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-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"overlay"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("@click")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"handleMenuClick"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"1"')]),s._v(">")]),s._v("Clicking me will not close the menu."),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"2"')]),s._v(">")]),s._v("Clicking me will not close the menu also."),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"3"')]),s._v(">")]),s._v("Clicking me will close the menu"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown")]),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\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 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 };\n },\n "),a("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n handleMenuClick(e) {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("if")]),s._v(" (e.key === "),a("span",{staticClass:"hljs-string"},[s._v("'3'")]),s._v(") {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".visible = "),a("span",{staticClass:"hljs-literal"},[s._v("false")]),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)};y._withStripped=!0;var k={data:function(){return{visible:!1}},methods:{handleMenuClick:function(s){"3"===s.key&&(this.visible=!1)}}},f=Object(e.a)(k,y,[],!1,null,null,null);f.options.__file="components/dropdown/demo/overlay-visible.md";var b=f.exports,x=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-dropdown-demo-placement">\n <template v-for="(placement, index) in placements">\n <a-dropdown :placement="placement">\n <a-button>{{placement}}</a-button>\n <a-menu slot="overlay">\n <a-menu-item>\n <a target="_blank" rel="noopener noreferrer" href="http://www.alipay.com/">1st menu item</a>\n </a-menu-item>\n <a-menu-item>\n <a target="_blank" rel="noopener noreferrer" href="http://www.taobao.com/">2nd menu item</a>\n </a-menu-item>\n <a-menu-item>\n <a target="_blank" rel="noopener noreferrer" href="http://www.tmall.com/">3rd menu item</a>\n </a-menu-item>\n </a-menu>\n </a-dropdown>\n <br v-if="index === 2"/>\n </template>\n </div>\n',script:"\n export default {\n data() {\n return {\n placements: [\n 'bottomLeft',\n 'bottomCenter',\n 'bottomRight',\n 'topLeft',\n 'topCenter',\n 'topRight',\n ],\n };\n },\n };\n",style:"\n #components-dropdown-demo-placement .ant-btn {\n margin-right: 8px;\n margin-bottom: 8px;\n }\n",us:"\n#### Placement\nSupport 6 placements.\n",cn:"\n#### 弹出位置\n支持 6 个弹出位置。\n",sourceCode:'<template>\n <div id="components-dropdown-demo-placement">\n <template v-for="(placement, index) in placements">\n <a-dropdown :placement="placement">\n <a-button>{{placement}}</a-button>\n <a-menu slot="overlay">\n <a-menu-item>\n <a target="_blank" rel="noopener noreferrer" href="http://www.alipay.com/"\n >1st menu item</a\n >\n </a-menu-item>\n <a-menu-item>\n <a target="_blank" rel="noopener noreferrer" href="http://www.taobao.com/"\n >2nd menu item</a\n >\n </a-menu-item>\n <a-menu-item>\n <a target="_blank" rel="noopener noreferrer" href="http://www.tmall.com/"\n >3rd menu item</a\n >\n </a-menu-item>\n </a-menu>\n </a-dropdown>\n <br v-if="index === 2" />\n </template>\n </div>\n</template>\n\n<script>\n export default {\n data() {\n return {\n placements: [\n \'bottomLeft\',\n \'bottomCenter\',\n \'bottomRight\',\n \'topLeft\',\n \'topCenter\',\n \'topRight\',\n ],\n };\n },\n };\n<\/script>\n<style>\n #components-dropdown-demo-placement .ant-btn {\n margin-right: 8px;\n margin-bottom: 8px;\n }\n</style>\n'}}},[a("template",{slot:"component"},[a("div",{attrs:{id:"components-dropdown-demo-placement"}},[s._l(s.placements,(function(t,n){return[a("a-dropdown",{attrs:{placement:t}},[a("a-button",[s._v(s._s(t))]),s._v(" "),a("a-menu",{attrs:{slot:"overlay"},slot:"overlay"},[a("a-menu-item",[a("a",{attrs:{target:"_blank",rel:"noopener noreferrer",href:"http://www.alipay.com/"}},[s._v("1st menu item")])]),s._v(" "),a("a-menu-item",[a("a",{attrs:{target:"_blank",rel:"noopener noreferrer",href:"http://www.taobao.com/"}},[s._v("2nd menu item")])]),s._v(" "),a("a-menu-item",[a("a",{attrs:{target:"_blank",rel:"noopener noreferrer",href:"http://www.tmall.com/"}},[s._v("3rd menu item")])])],1)],1),s._v(" "),2===n?a("br"):s._e()]}))],2)]),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("支持 6 个弹出位置。")])]),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("Support 6 placements.")])]),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-dropdown-demo-placement"')]),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("v-for")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"(placement, index) in placements"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v(":placement")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"placement"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-button")]),s._v(">")]),a("span",[s._v("{{")]),s._v("placement"),a("span",[s._v("}}")]),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-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"overlay"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),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("target")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"_blank"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("rel")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"noopener noreferrer"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"http://www.alipay.com/"')]),s._v("\n >")]),s._v("1st menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a")]),s._v("\n >")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),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("target")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"_blank"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("rel")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"noopener noreferrer"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"http://www.taobao.com/"')]),s._v("\n >")]),s._v("2nd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a")]),s._v("\n >")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),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("target")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"_blank"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("rel")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"noopener noreferrer"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"http://www.tmall.com/"')]),s._v("\n >")]),s._v("3rd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a")]),s._v("\n >")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("br")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("v-if")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"index === 2"')]),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("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\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 data() {\n "),a("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),a("span",{staticClass:"hljs-attr"},[s._v("placements")]),s._v(": [\n "),a("span",{staticClass:"hljs-string"},[s._v("'bottomLeft'")]),s._v(",\n "),a("span",{staticClass:"hljs-string"},[s._v("'bottomCenter'")]),s._v(",\n "),a("span",{staticClass:"hljs-string"},[s._v("'bottomRight'")]),s._v(",\n "),a("span",{staticClass:"hljs-string"},[s._v("'topLeft'")]),s._v(",\n "),a("span",{staticClass:"hljs-string"},[s._v("'topCenter'")]),s._v(",\n "),a("span",{staticClass:"hljs-string"},[s._v("'topRight'")]),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"),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("style")]),s._v(">")]),a("span",{staticClass:"css"},[s._v("\n "),a("span",{staticClass:"hljs-selector-id"},[s._v("#components-dropdown-demo-placement")]),s._v(" "),a("span",{staticClass:"hljs-selector-class"},[s._v(".ant-btn")]),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)};x._withStripped=!0;var M={data:function(){return{placements:["bottomLeft","bottomCenter","bottomRight","topLeft","topCenter","topRight"]}}},B=(a(1316),Object(e.a)(M,x,[],!1,null,null,null));B.options.__file="components/dropdown/demo/placement.md";var D=B.exports,S=function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-dropdown>\n <a class="ant-dropdown-link" href="#"> Cascading menu <a-icon type="down"/> </a>\n <a-menu slot="overlay">\n <a-menu-item>1st menu item</a-menu-item>\n <a-menu-item>2nd menu item</a-menu-item>\n <a-sub-menu title="sub menu" key="test">\n <a-menu-item>3rd menu item</a-menu-item>\n <a-menu-item>4th menu item</a-menu-item>\n </a-sub-menu>\n <a-sub-menu title="disabled sub menu" disabled="">\n <a-menu-item>5d menu item</a-menu-item>\n <a-menu-item>6th menu item</a-menu-item>\n </a-sub-menu>\n </a-menu>\n </a-dropdown>\n',script:null,style:null,us:"\n#### Cascading menu\nThe menu has multiple levels.\n",cn:"\n#### 多级菜单\n传入的菜单里有多个层级。\n",sourceCode:'<template>\n <a-dropdown>\n <a class="ant-dropdown-link" href="#"> Cascading menu <a-icon type="down" /> </a>\n <a-menu slot="overlay">\n <a-menu-item>1st menu item</a-menu-item>\n <a-menu-item>2nd menu item</a-menu-item>\n <a-sub-menu title="sub menu" key="test">\n <a-menu-item>3rd menu item</a-menu-item>\n <a-menu-item>4th menu item</a-menu-item>\n </a-sub-menu>\n <a-sub-menu title="disabled sub menu" disabled>\n <a-menu-item>5d menu item</a-menu-item>\n <a-menu-item>6th menu item</a-menu-item>\n </a-sub-menu>\n </a-menu>\n </a-dropdown>\n</template>\n'}}},[a("template",{slot:"component"},[a("a-dropdown",[a("a",{staticClass:"ant-dropdown-link",attrs:{href:"#"}},[s._v(" Cascading menu "),a("a-icon",{attrs:{type:"down"}})],1),s._v(" "),a("a-menu",{attrs:{slot:"overlay"},slot:"overlay"},[a("a-menu-item",[s._v("1st menu item")]),s._v(" "),a("a-menu-item",[s._v("2nd menu item")]),s._v(" "),a("a-sub-menu",{key:"test",attrs:{title:"sub menu"}},[a("a-menu-item",[s._v("3rd menu item")]),s._v(" "),a("a-menu-item",[s._v("4th menu item")])],1),s._v(" "),a("a-sub-menu",{attrs:{title:"disabled sub menu",disabled:""}},[a("a-menu-item",[s._v("5d menu item")]),s._v(" "),a("a-menu-item",[s._v("6th menu item")])],1)],1)],1)],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:"Cascading-menu"}},[s._v("Cascading menu "),a("a",{staticClass:"anchor",attrs:{href:"#Cascading-menu"}},[s._v("#")])]),s._v(" "),a("p",[s._v("The menu has multiple levels.")])]),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-dropdown")]),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("class")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"ant-dropdown-link"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"#"')]),s._v(">")]),s._v(" Cascading menu "),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"down"')]),s._v(" />")]),s._v(" "),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-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"overlay"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("1st menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("2nd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-sub-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("title")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"sub menu"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"test"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("3rd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("4th menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-sub-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-sub-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("title")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"disabled sub menu"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("disabled")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("5d menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("6th menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-sub-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown")]),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)};S._withStripped=!0;var T=Object(e.a)({},S,[],!1,null,null,null);T.options.__file="components/dropdown/demo/sub-menu.md";var L=T.exports,R=function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-dropdown :trigger="[\'click\']">\n <a class="ant-dropdown-link" href="#"> Click me <a-icon type="down"/> </a>\n <a-menu slot="overlay">\n <a-menu-item key="0">\n <a href="http://www.alipay.com/">1st menu item</a>\n </a-menu-item>\n <a-menu-item key="1">\n <a href="http://www.taobao.com/">2nd menu item</a>\n </a-menu-item>\n <a-menu-divider/>\n <a-menu-item key="3">3rd menu item</a-menu-item>\n </a-menu>\n </a-dropdown>\n',script:null,style:null,us:"\n#### Trigger mode\nThe default trigger mode is `hover`, you can change it to `click`.\n",cn:"\n#### 触发方式\n默认是移入触发菜单,可以点击触发。\n",sourceCode:'<template>\n <a-dropdown :trigger="[\'click\']">\n <a class="ant-dropdown-link" href="#"> Click me <a-icon type="down" /> </a>\n <a-menu slot="overlay">\n <a-menu-item key="0">\n <a href="http://www.alipay.com/">1st menu item</a>\n </a-menu-item>\n <a-menu-item key="1">\n <a href="http://www.taobao.com/">2nd menu item</a>\n </a-menu-item>\n <a-menu-divider />\n <a-menu-item key="3">3rd menu item</a-menu-item>\n </a-menu>\n </a-dropdown>\n</template>\n'}}},[a("template",{slot:"component"},[a("a-dropdown",{attrs:{trigger:["click"]}},[a("a",{staticClass:"ant-dropdown-link",attrs:{href:"#"}},[s._v(" Click me "),a("a-icon",{attrs:{type:"down"}})],1),s._v(" "),a("a-menu",{attrs:{slot:"overlay"},slot:"overlay"},[a("a-menu-item",{key:"0"},[a("a",{attrs:{href:"http://www.alipay.com/"}},[s._v("1st menu item")])]),s._v(" "),a("a-menu-item",{key:"1"},[a("a",{attrs:{href:"http://www.taobao.com/"}},[s._v("2nd menu item")])]),s._v(" "),a("a-menu-divider"),s._v(" "),a("a-menu-item",{key:"3"},[s._v("3rd menu item")])],1)],1)],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:"Trigger-mode"}},[s._v("Trigger mode "),a("a",{staticClass:"anchor",attrs:{href:"#Trigger-mode"}},[s._v("#")])]),s._v(" "),a("p",[s._v("The default trigger mode is "),a("code",[s._v("hover")]),s._v(", you can change it to "),a("code",[s._v("click")]),s._v(".")])]),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-dropdown")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v(":trigger")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v("\"['click']\"")]),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("class")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"ant-dropdown-link"')]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"#"')]),s._v(">")]),s._v(" Click me "),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("type")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"down"')]),s._v(" />")]),s._v(" "),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-menu")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"overlay"')]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"0"')]),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('"http://www.alipay.com/"')]),s._v(">")]),s._v("1st menu item"),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-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"1"')]),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('"http://www.taobao.com/"')]),s._v(">")]),s._v("2nd menu item"),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-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-divider")]),s._v(" />")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("<"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(" "),a("span",{staticClass:"hljs-attr"},[s._v("key")]),s._v("="),a("span",{staticClass:"hljs-string"},[s._v('"3"')]),s._v(">")]),s._v("3rd menu item"),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu-item")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-menu")]),s._v(">")]),s._v("\n "),a("span",{staticClass:"hljs-tag"},[s._v("</"),a("span",{staticClass:"hljs-name"},[s._v("a-dropdown")]),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)};R._withStripped=!0;var A=Object(e.a)({},R,[],!1,null,null,null);A.options.__file="components/dropdown/demo/trigger.md";var E=A.exports,O=function(){var s=this.$createElement;this._self._c;return this._m(0)};O._withStripped=!0;var H=Object(e.a)({},O,[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("p",[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("disabled")]),s._v(" "),a("td",[s._v("菜单是否禁用")]),s._v(" "),a("td",[s._v("boolean")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("getPopupContainer")]),s._v(" "),a("td",[s._v("菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位。")]),s._v(" "),a("td",[s._v("Function(triggerNode)")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("() => document.body")])])]),s._v(" "),a("tr",[a("td",[s._v("overlay(slot-scope)")]),s._v(" "),a("td",[s._v("菜单")]),s._v(" "),a("td",[a("a",{attrs:{href:"/components/menu-cn"}},[s._v("Menu")])]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("overlayClassName")]),s._v(" "),a("td",[s._v("下拉根元素的类名称")]),s._v(" "),a("td",[s._v("string")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("overlayStyle")]),s._v(" "),a("td",[s._v("下拉根元素的样式")]),s._v(" "),a("td",[s._v("object")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("placement")]),s._v(" "),a("td",[s._v("菜单弹出位置:"),a("code",{pre:!0},[s._v("bottomLeft")]),s._v(" "),a("code",{pre:!0},[s._v("bottomCenter")]),s._v(" "),a("code",{pre:!0},[s._v("bottomRight")]),s._v(" "),a("code",{pre:!0},[s._v("topLeft")]),s._v(" "),a("code",{pre:!0},[s._v("topCenter")]),s._v(" "),a("code",{pre:!0},[s._v("topRight")])]),s._v(" "),a("td",[s._v("String")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("bottomLeft")])])]),s._v(" "),a("tr",[a("td",[s._v("trigger")]),s._v(" "),a("td",[s._v("触发下拉的行为, 移动端不支持 hover")]),s._v(" "),a("td",[s._v("Array<"),a("code",{pre:!0},[s._v("click")]),s._v("|"),a("code",{pre:!0},[s._v("hover")]),s._v("|"),a("code",{pre:!0},[s._v("contextmenu")]),s._v(">")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("['hover']")])])]),s._v(" "),a("tr",[a("td",[s._v("visible(v-model)")]),s._v(" "),a("td",[s._v("菜单是否显示")]),s._v(" "),a("td",[s._v("boolean")]),s._v(" "),a("td",[s._v("-")])])])]),s._v(" "),a("p",[a("code",{pre:!0},[s._v("overlay")]),s._v(" 菜单使用 "),a("a",{attrs:{href:"/components/menu-cn/"}},[s._v("Menu")]),s._v(",还包括菜单项 "),a("code",{pre:!0},[s._v("Menu.Item")]),s._v(",分割线 "),a("code",{pre:!0},[s._v("Menu.Divider")]),s._v("。")]),s._v(" "),a("blockquote",[a("p",[s._v("注意: Menu.Item 必须设置唯一的 key 属性。")]),s._v(" "),a("p",[s._v("Dropdown 下的 Menu 默认不可选中。如果需要菜单可选中,可以指定 "),a("code",{pre:!0},[s._v("<Menu selectable>")]),s._v(".")])]),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("visibleChange")]),s._v(" "),a("td",[s._v("菜单显示状态改变时调用,参数为 visible")]),s._v(" "),a("td",[s._v("function(visible)")])])])]),s._v(" "),a("h3",{attrs:{id:"Dropdown.Button"}},[s._v("Dropdown.Button "),a("a",{staticClass:"anchor",attrs:{href:"#Dropdown.Button"}},[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("disabled")]),s._v(" "),a("td",[s._v("菜单是否禁用")]),s._v(" "),a("td",[s._v("boolean")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("overlay(slot-scope)")]),s._v(" "),a("td",[s._v("菜单")]),s._v(" "),a("td",[a("a",{attrs:{href:"/components/menu-cn/"}},[s._v("Menu")])]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("placement")]),s._v(" "),a("td",[s._v("菜单弹出位置:"),a("code",{pre:!0},[s._v("bottomLeft")]),s._v(" "),a("code",{pre:!0},[s._v("bottomCenter")]),s._v(" "),a("code",{pre:!0},[s._v("bottomRight")]),s._v(" "),a("code",{pre:!0},[s._v("topLeft")]),s._v(" "),a("code",{pre:!0},[s._v("topCenter")]),s._v(" "),a("code",{pre:!0},[s._v("topRight")])]),s._v(" "),a("td",[s._v("String")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("bottomLeft")])])]),s._v(" "),a("tr",[a("td",[s._v("size")]),s._v(" "),a("td",[s._v("按钮大小,和 "),a("a",{attrs:{href:"/components/button-cn/"}},[s._v("Button")]),s._v(" 一致")]),s._v(" "),a("td",[s._v("string")]),s._v(" "),a("td",[s._v("'default'")])]),s._v(" "),a("tr",[a("td",[s._v("trigger")]),s._v(" "),a("td",[s._v("触发下拉的行为")]),s._v(" "),a("td",[s._v("Array<"),a("code",{pre:!0},[s._v("click")]),s._v("|"),a("code",{pre:!0},[s._v("hover")]),s._v("|"),a("code",{pre:!0},[s._v("contextmenu")]),s._v(">")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("['hover']")])])]),s._v(" "),a("tr",[a("td",[s._v("type")]),s._v(" "),a("td",[s._v("按钮类型,和 "),a("a",{attrs:{href:"/components/button-cn/"}},[s._v("Button")]),s._v(" 一致")]),s._v(" "),a("td",[s._v("string")]),s._v(" "),a("td",[s._v("'default'")])]),s._v(" "),a("tr",[a("td",[s._v("visible(v-model)")]),s._v(" "),a("td",[s._v("菜单是否显示")]),s._v(" "),a("td",[s._v("boolean")]),s._v(" "),a("td",[s._v("-")])])])]),s._v(" "),a("h3",{attrs:{id:"Dropdown.Button-事件"}},[s._v("Dropdown.Button 事件 "),a("a",{staticClass:"anchor",attrs:{href:"#Dropdown.Button-事件"}},[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("click")]),s._v(" "),a("td",[s._v("点击左侧按钮的回调,和 "),a("a",{attrs:{href:"/components/button-cn/"}},[s._v("Button")]),s._v(" 一致")]),s._v(" "),a("td",[s._v("Function")])]),s._v(" "),a("tr",[a("td",[s._v("visibleChange")]),s._v(" "),a("td",[s._v("菜单显示状态改变时调用,参数为 visible")]),s._v(" "),a("td",[s._v("function(visible)")])])])])])}],!1,null,null,null);H.options.__file="components/dropdown/index.zh-CN.md";var $=H.exports,P=function(){var s=this.$createElement;this._self._c;return this._m(0)};P._withStripped=!0;var I=Object(e.a)({},P,[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("h3",{attrs:{id:"Dropdown"}},[s._v("Dropdown "),a("a",{staticClass:"anchor",attrs:{href:"#Dropdown"}},[s._v("#")])]),s._v(" "),a("table",[a("thead",[a("tr",[a("th",[s._v("Property")]),s._v(" "),a("th",[s._v("Description")]),s._v(" "),a("th",[s._v("Type")]),s._v(" "),a("th",[s._v("Default")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("disabled")]),s._v(" "),a("td",[s._v("whether the dropdown menu is disabled")]),s._v(" "),a("td",[s._v("boolean")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("getPopupContainer")]),s._v(" "),a("td",[s._v("to set the container of the dropdown menu. The default is to create a "),a("code",{pre:!0},[s._v("div")]),s._v(" element in "),a("code",{pre:!0},[s._v("body")]),s._v(", you can reset it to the scrolling area and make a relative reposition. "),a("a",{attrs:{href:"https://codepen.io/afc163/pen/zEjNOy?editors=0010"}},[s._v("example")])]),s._v(" "),a("td",[s._v("Function(triggerNode)")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("() => document.body")])])]),s._v(" "),a("tr",[a("td",[s._v("overlay(slot-scope)")]),s._v(" "),a("td",[s._v("the dropdown menu")]),s._v(" "),a("td",[a("a",{attrs:{href:"/components/menu"}},[s._v("Menu")])]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("overlayClassName")]),s._v(" "),a("td",[s._v("Class name of the dropdown root element")]),s._v(" "),a("td",[s._v("string")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("overlayStyle")]),s._v(" "),a("td",[s._v("Style of the dropdown root element")]),s._v(" "),a("td",[s._v("object")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("placement")]),s._v(" "),a("td",[s._v("placement of pop menu: "),a("code",{pre:!0},[s._v("bottomLeft")]),s._v(" "),a("code",{pre:!0},[s._v("bottomCenter")]),s._v(" "),a("code",{pre:!0},[s._v("bottomRight")]),s._v(" "),a("code",{pre:!0},[s._v("topLeft")]),s._v(" "),a("code",{pre:!0},[s._v("topCenter")]),s._v(" "),a("code",{pre:!0},[s._v("topRight")])]),s._v(" "),a("td",[s._v("String")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("bottomLeft")])])]),s._v(" "),a("tr",[a("td",[s._v("trigger")]),s._v(" "),a("td",[s._v("the trigger mode which executes the drop-down action, hover doesn't work on mobile device")]),s._v(" "),a("td",[s._v("Array<"),a("code",{pre:!0},[s._v("click")]),s._v("|"),a("code",{pre:!0},[s._v("hover")]),s._v("|"),a("code",{pre:!0},[s._v("contextmenu")]),s._v(">")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("['hover']")])])]),s._v(" "),a("tr",[a("td",[s._v("visible(v-model)")]),s._v(" "),a("td",[s._v("whether the dropdown menu is visible")]),s._v(" "),a("td",[s._v("boolean")]),s._v(" "),a("td",[s._v("-")])])])]),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("visibleChange")]),s._v(" "),a("td",[s._v("a callback function takes an argument: "),a("code",{pre:!0},[s._v("visible")]),s._v(", is executed when the visible state is changed")]),s._v(" "),a("td",[s._v("function(visible)")])])])]),s._v(" "),a("p",[s._v("You should use "),a("a",{attrs:{href:"/components/menu/"}},[s._v("Menu")]),s._v(" as "),a("code",{pre:!0},[s._v("overlay")]),s._v(". The menu items and dividers are also available by using "),a("code",{pre:!0},[s._v("Menu.Item")]),s._v(" and "),a("code",{pre:!0},[s._v("Menu.Divider")]),s._v(".")]),s._v(" "),a("blockquote",[a("p",[s._v("Warning: You must set a unique "),a("code",{pre:!0},[s._v("key")]),s._v(" for "),a("code",{pre:!0},[s._v("Menu.Item")]),s._v(".")]),s._v(" "),a("p",[s._v("Menu of Dropdown is unselectable by default, you can make it selectable via "),a("code",{pre:!0},[s._v("<Menu selectable>")]),s._v(".")])]),s._v(" "),a("h3",{attrs:{id:"Dropdown.Button"}},[s._v("Dropdown.Button "),a("a",{staticClass:"anchor",attrs:{href:"#Dropdown.Button"}},[s._v("#")])]),s._v(" "),a("table",[a("thead",[a("tr",[a("th",[s._v("Property")]),s._v(" "),a("th",[s._v("Description")]),s._v(" "),a("th",[s._v("Type")]),s._v(" "),a("th",[s._v("Default")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("disabled")]),s._v(" "),a("td",[s._v("whether the dropdown menu is disabled")]),s._v(" "),a("td",[s._v("boolean")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("overlay(slot-scope)")]),s._v(" "),a("td",[s._v("the dropdown menu")]),s._v(" "),a("td",[a("a",{attrs:{href:"/components/menu"}},[s._v("Menu")])]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("placement")]),s._v(" "),a("td",[s._v("placement of pop menu: "),a("code",{pre:!0},[s._v("bottomLeft")]),s._v(" "),a("code",{pre:!0},[s._v("bottomCenter")]),s._v(" "),a("code",{pre:!0},[s._v("bottomRight")]),s._v(" "),a("code",{pre:!0},[s._v("topLeft")]),s._v(" "),a("code",{pre:!0},[s._v("topCenter")]),s._v(" "),a("code",{pre:!0},[s._v("topRight")])]),s._v(" "),a("td",[s._v("String")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("bottomLeft")])])]),s._v(" "),a("tr",[a("td",[s._v("size")]),s._v(" "),a("td",[s._v("size of the button, the same as "),a("a",{attrs:{href:"/components/button"}},[s._v("Button")])]),s._v(" "),a("td",[s._v("string")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("default")])])]),s._v(" "),a("tr",[a("td",[s._v("trigger")]),s._v(" "),a("td",[s._v("the trigger mode which executes the drop-down action")]),s._v(" "),a("td",[s._v("Array<"),a("code",{pre:!0},[s._v("click")]),s._v("|"),a("code",{pre:!0},[s._v("hover")]),s._v("|"),a("code",{pre:!0},[s._v("contextmenu")]),s._v(">")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("['hover']")])])]),s._v(" "),a("tr",[a("td",[s._v("type")]),s._v(" "),a("td",[s._v("type of the button, the same as "),a("a",{attrs:{href:"/components/button"}},[s._v("Button")])]),s._v(" "),a("td",[s._v("string")]),s._v(" "),a("td",[a("code",{pre:!0},[s._v("default")])])]),s._v(" "),a("tr",[a("td",[s._v("visible")]),s._v(" "),a("td",[s._v("whether the dropdown menu is visible")]),s._v(" "),a("td",[s._v("boolean")]),s._v(" "),a("td",[s._v("-")])])])]),s._v(" "),a("h3",{attrs:{id:"Dropdown.Button-events"}},[s._v("Dropdown.Button events "),a("a",{staticClass:"anchor",attrs:{href:"#Dropdown.Button-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("click")]),s._v(" "),a("td",[s._v("a callback function, the same as "),a("a",{attrs:{href:"/components/button"}},[s._v("Button")]),s._v(", which will be executed when you click the button on the left")]),s._v(" "),a("td",[s._v("Function")])]),s._v(" "),a("tr",[a("td",[s._v("visibleChange")]),s._v(" "),a("td",[s._v("a callback function takes an argument: "),a("code",{pre:!0},[s._v("visible")]),s._v(", is executed when the visible state is changed")]),s._v(" "),a("td",[s._v("Function")])])])])])}],!1,null,null,null);I.options.__file="components/dropdown/index.en-US.md";var N=I.exports,z="# 下拉菜单\n 向下弹出的列表。\n ## 何时使用\n 当页面上的操作命令过多时,用此组件可以收纳操作元素。点击或移入触点,会出现一个下拉菜单。可在列表中进行选择,并执行相应的命令。\n ## 代码演示",F="# Dropdown\n A dropdown list.\n ## When To Use\n If there are too many operations to display, you can wrap them in a `Dropdown`. By clicking/hovering on the trigger, a dropdown menu should appear, which allows you to choose one option and execute relevant actions.\n ## Examples \n ",q={category:"Components",subtitle:"下拉菜单",type:"Navigation",zhType:"导航",title:"Dropdown",render:function(){var s=arguments[0];return s("div",[s("md",{attrs:{cn:z,us:F}}),s(v),s(m),s(p),s(C),s(w),s(b),s(D),s(L),s(E),s("api",[s($,{slot:"cn"}),s(N)])])}},J=Object(e.a)(q,void 0,void 0,!1,null,null,null);J.options.__file="components/dropdown/demo/index.vue";t.default=J.exports}}]); |