ant-design-vue/fb4ee76b.async.js

1 line
145 KiB
JavaScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters!

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

(window.webpackJsonp=window.webpackJsonp||[]).push([[13],{1213:function(t,s,a){},1287:function(t,s,a){var e,n,l;n=[s,t],void 0===(l="function"==typeof(e=function(t,s){"use strict";var a=5e3,e="callback";function n(){return"jsonp_"+Date.now()+"_"+Math.ceil(1e5*Math.random())}function l(t){try{delete window[t]}catch(s){window[t]=void 0}}function v(t){var s=document.getElementById(t);s&&document.getElementsByTagName("head")[0].removeChild(s)}s.exports=function(t){var s=arguments.length<=1||void 0===arguments[1]?{}:arguments[1],i=t,_=s.timeout||a,c=s.jsonpCallback||e,o=void 0;return new Promise((function(a,e){var r=s.jsonpCallbackFunction||n(),p=c+"_"+r;window[r]=function(t){a({ok:!0,json:function(){return Promise.resolve(t)}}),o&&clearTimeout(o),v(p),l(r)},i+=-1===i.indexOf("?")?"?":"&";var h=document.createElement("script");h.setAttribute("src",""+i+c+"="+r),s.charset&&h.setAttribute("charset",s.charset),h.id=p,document.getElementsByTagName("head")[0].appendChild(h),o=setTimeout((function(){e(new Error("JSONP request to "+t+" timed out")),l(r),v(p),window[r]=function(){l(r)}}),_),h.onerror=function(){e(new Error("JSONP request to "+t+" failed")),l(r),v(p),o&&clearTimeout(o)}}))}})?e.apply(s,n):e)||(t.exports=l)},1288:function(t,s,a){"use strict";s.decode=s.parse=a(1307),s.encode=s.stringify=a(1308)},1307:function(t,s,a){"use strict";function e(t,s){return Object.prototype.hasOwnProperty.call(t,s)}t.exports=function(t,s,a,l){s=s||"&",a=a||"=";var v={};if("string"!=typeof t||0===t.length)return v;var i=/\+/g;t=t.split(s);var _=1e3;l&&"number"==typeof l.maxKeys&&(_=l.maxKeys);var c=t.length;_>0&&c>_&&(c=_);for(var o=0;o<c;++o){var r,p,h,d,u=t[o].replace(i,"%20"),C=u.indexOf(a);C>=0?(r=u.substr(0,C),p=u.substr(C+1)):(r=u,p=""),h=decodeURIComponent(r),d=decodeURIComponent(p),e(v,h)?n(v[h])?v[h].push(d):v[h]=[v[h],d]:v[h]=d}return v};var n=Array.isArray||function(t){return"[object Array]"===Object.prototype.toString.call(t)}},1308:function(t,s,a){"use strict";var e=function(t){switch(typeof t){case"string":return t;case"boolean":return t?"true":"false";case"number":return isFinite(t)?t:"";default:return""}};t.exports=function(t,s,a,i){return s=s||"&",a=a||"=",null===t&&(t=void 0),"object"==typeof t?l(v(t),(function(v){var i=encodeURIComponent(e(v))+a;return n(t[v])?l(t[v],(function(t){return i+encodeURIComponent(e(t))})).join(s):i+encodeURIComponent(e(t[v]))})).join(s):i?encodeURIComponent(e(i))+a+encodeURIComponent(e(t)):""};var n=Array.isArray||function(t){return"[object Array]"===Object.prototype.toString.call(t)};function l(t,s){if(t.map)return t.map(s);for(var a=[],e=0;e<t.length;e++)a.push(s(t[e],e));return a}var v=Object.keys||function(t){var s=[];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&s.push(a);return s}},1309:function(t,s,a){"use strict";var e=a(1213);a.n(e).a},1421:function(t,s,a){"use strict";a.r(s);var e=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-select defaultValue="lucy" style="width: 120px" @change="handleChange">\n <a-select-option value="jack">Jack</a-select-option>\n <a-select-option value="lucy">Lucy</a-select-option>\n <a-select-option value="disabled" disabled="">Disabled</a-select-option>\n <a-select-option value="Yiminghe">yiminghe</a-select-option>\n </a-select>\n <a-select defaultValue="lucy" style="width: 120px" disabled="">\n <a-select-option value="lucy">Lucy</a-select-option>\n </a-select>\n <a-select defaultValue="lucy" style="width: 120px" loading="">\n <a-select-option value="lucy">Lucy</a-select-option>\n </a-select>\n </div>\n',script:"\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n",style:null,us:"\n#### Basic Usage\nBasic Usage\n",cn:"\n#### 基本使用\n基本使用。\n",sourceCode:'<template>\n <div>\n <a-select defaultValue="lucy" style="width: 120px" @change="handleChange">\n <a-select-option value="jack">Jack</a-select-option>\n <a-select-option value="lucy">Lucy</a-select-option>\n <a-select-option value="disabled" disabled>Disabled</a-select-option>\n <a-select-option value="Yiminghe">yiminghe</a-select-option>\n </a-select>\n <a-select defaultValue="lucy" style="width: 120px" disabled>\n <a-select-option value="lucy">Lucy</a-select-option>\n </a-select>\n <a-select defaultValue="lucy" style="width: 120px" loading>\n <a-select-option value="lucy">Lucy</a-select-option>\n </a-select>\n </div>\n</template>\n<script>\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-select",{staticStyle:{width:"120px"},attrs:{defaultValue:"lucy"},on:{change:t.handleChange}},[a("a-select-option",{attrs:{value:"jack"}},[t._v("Jack")]),t._v(" "),a("a-select-option",{attrs:{value:"lucy"}},[t._v("Lucy")]),t._v(" "),a("a-select-option",{attrs:{value:"disabled",disabled:""}},[t._v("Disabled")]),t._v(" "),a("a-select-option",{attrs:{value:"Yiminghe"}},[t._v("yiminghe")])],1),t._v(" "),a("a-select",{staticStyle:{width:"120px"},attrs:{defaultValue:"lucy",disabled:""}},[a("a-select-option",{attrs:{value:"lucy"}},[t._v("Lucy")])],1),t._v(" "),a("a-select",{staticStyle:{width:"120px"},attrs:{defaultValue:"lucy",loading:""}},[a("a-select-option",{attrs:{value:"lucy"}},[t._v("Lucy")])],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("基本使用。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Basic-Usage"}},[t._v("Basic Usage "),a("a",{staticClass:"anchor",attrs:{href:"#Basic-Usage"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Basic Usage")])]),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-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 120px"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"jack"')]),t._v(">")]),t._v("Jack"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(">")]),t._v("Lucy"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"disabled"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("Disabled"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"Yiminghe"')]),t._v(">")]),t._v("yiminghe"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 120px"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(">")]),t._v("Lucy"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 120px"')]),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-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(">")]),t._v("Lucy"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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 handleChange(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("`selected "),a("span",{staticClass:"hljs-subst"},[t._v("${value}")]),t._v("`")]),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)};e._withStripped=!0;var n={methods:{handleChange:function(t){console.log("selected "+t)}}},l=a(31),v=Object(l.a)(n,e,[],!1,null,null,null);v.options.__file="components/select/demo/basic.md";var i=v.exports,_=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 v-model="size">\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-select :size="size" defaultValue="a1" style="width: 200px" @change="handleChange">\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">\n {{(i + 9).toString(36) + i}}\n </a-select-option>\n </a-select>\n <br/>\n <a-select mode="multiple" :size="size" placeholder="Please select" :defaultValue="[\'a1\', \'b2\']" style="width: 200px" @change="handleChange" @popupScroll="popupScroll">\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">\n {{(i + 9).toString(36) + i}}\n </a-select-option>\n </a-select>\n <br/>\n <a-select mode="tags" :size="size" placeholder="Please select" :defaultValue="[\'a1\', \'b2\']" style="width: 200px" @change="handleChange">\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">\n {{(i + 9).toString(36) + i}}\n </a-select-option>\n </a-select>\n </div>\n',script:"\n export default {\n data() {\n return {\n size: 'default',\n };\n },\n methods: {\n handleChange(value) {\n console.log(`Selected: ${value}`);\n },\n popupScroll() {\n console.log('popupScroll');\n },\n },\n };\n",style:null,us:"\n#### Sizes\nThe height of the input field for the select defaults to 32px. If size is set to large, the height will be 40px, and if set to small, 24px.\n",cn:"\n#### 三种大小\n三种大小的选择框当 size 分别为 `large` 和 `small` 时,输入框高度为 `40px` 和 `24px` ,默认高度为 `32px`。\n",sourceCode:'<template>\n <div>\n <a-radio-group v-model="size">\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-select :size="size" defaultValue="a1" style="width: 200px" @change="handleChange">\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">\n {{(i + 9).toString(36) + i}}\n </a-select-option>\n </a-select>\n <br />\n <a-select\n mode="multiple"\n :size="size"\n placeholder="Please select"\n :defaultValue="[\'a1\', \'b2\']"\n style="width: 200px"\n @change="handleChange"\n @popupScroll="popupScroll"\n >\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">\n {{(i + 9).toString(36) + i}}\n </a-select-option>\n </a-select>\n <br />\n <a-select\n mode="tags"\n :size="size"\n placeholder="Please select"\n :defaultValue="[\'a1\', \'b2\']"\n style="width: 200px"\n @change="handleChange"\n >\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">\n {{(i + 9).toString(36) + i}}\n </a-select-option>\n </a-select>\n </div>\n</template>\n<script>\n export default {\n data() {\n return {\n size: \'default\',\n };\n },\n methods: {\n handleChange(value) {\n console.log(`Selected: ${value}`);\n },\n popupScroll() {\n console.log(\'popupScroll\');\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-radio-group",{model:{value:t.size,callback:function(s){t.size=s},expression:"size"}},[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-select",{staticStyle:{width:"200px"},attrs:{size:t.size,defaultValue:"a1"},on:{change:t.handleChange}},t._l(25,(function(s){return a("a-select-option",{key:(s+9).toString(36)+s},[t._v("\n "+t._s((s+9).toString(36)+s)+"\n ")])})),1),t._v(" "),a("br"),t._v(" "),a("a-select",{staticStyle:{width:"200px"},attrs:{mode:"multiple",size:t.size,placeholder:"Please select",defaultValue:["a1","b2"]},on:{change:t.handleChange,popupScroll:t.popupScroll}},t._l(25,(function(s){return a("a-select-option",{key:(s+9).toString(36)+s},[t._v("\n "+t._s((s+9).toString(36)+s)+"\n ")])})),1),t._v(" "),a("br"),t._v(" "),a("a-select",{staticStyle:{width:"200px"},attrs:{mode:"tags",size:t.size,placeholder:"Please select",defaultValue:["a1","b2"]},on:{change:t.handleChange}},t._l(25,(function(s){return a("a-select-option",{key:(s+9).toString(36)+s},[t._v("\n "+t._s((s+9).toString(36)+s)+"\n ")])})),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("三种大小的选择框,当 size 分别为 "),a("code",[t._v("large")]),t._v(" 和 "),a("code",[t._v("small")]),t._v(" 时,输入框高度为 "),a("code",[t._v("40px")]),t._v(" 和 "),a("code",[t._v("24px")]),t._v(" ,默认高度为 "),a("code",[t._v("32px")]),t._v("。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Sizes"}},[t._v("Sizes "),a("a",{staticClass:"anchor",attrs:{href:"#Sizes"}},[t._v("#")])]),t._v(" "),a("p",[t._v("The height of the input field for the select defaults to 32px. If size is set to large, the height will be 40px, and if set to small, 24px.")])]),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("v-model")]),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-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-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"a1"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 200px"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-for")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"i in 25"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"(i + 9).toString(36) + i"')]),t._v(">")]),t._v("\n "),a("span",[t._v("{{")]),t._v("(i + 9).toString(36) + i"),a("span",[t._v("}}")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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-select")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("mode")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"multiple"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"Please select"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v("\"['a1', 'b2']\"")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 200px"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@popupScroll")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"popupScroll"')]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-for")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"i in 25"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"(i + 9).toString(36) + i"')]),t._v(">")]),t._v("\n "),a("span",[t._v("{{")]),t._v("(i + 9).toString(36) + i"),a("span",[t._v("}}")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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-select")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("mode")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"tags"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"size"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"Please select"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v("\"['a1', 'b2']\"")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 200px"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-for")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"i in 25"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"(i + 9).toString(36) + i"')]),t._v(">")]),t._v("\n "),a("span",[t._v("{{")]),t._v("(i + 9).toString(36) + i"),a("span",[t._v("}}")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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("'default'")]),t._v(",\n };\n },\n "),a("span",{staticClass:"hljs-attr"},[t._v("methods")]),t._v(": {\n handleChange(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("`Selected: "),a("span",{staticClass:"hljs-subst"},[t._v("${value}")]),t._v("`")]),t._v(");\n },\n popupScroll() {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("'popupScroll'")]),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)};_._withStripped=!0;var c={data:function(){return{size:"default"}},methods:{handleChange:function(t){console.log("Selected: "+t)},popupScroll:function(){console.log("popupScroll")}}},o=Object(l.a)(c,_,[],!1,null,null,null);o.options.__file="components/select/demo/size.md";var r=o.exports,p=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-select mode="tags" style="width: 100%" @change="handleChange" placeholder="Tags Mode">\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">{{(i + 9).toString(36) + i}}</a-select-option>\n </a-select>\n',script:"\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n",style:null,us:"\n#### Tags\nSelect with tags, transform input to tag (scroll the menu)\n",cn:"\n#### 标签\ntags select随意输入的内容scroll the menu\n",sourceCode:'<template>\n <a-select mode="tags" style="width: 100%" @change="handleChange" placeholder="Tags Mode">\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i"\n >{{(i + 9).toString(36) + i}}</a-select-option\n >\n </a-select>\n</template>\n<script>\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-select",{staticStyle:{width:"100%"},attrs:{mode:"tags",placeholder:"Tags Mode"},on:{change:t.handleChange}},t._l(25,(function(s){return a("a-select-option",{key:(s+9).toString(36)+s},[t._v(t._s((s+9).toString(36)+s))])})),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("tags select随意输入的内容scroll the menu")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Tags"}},[t._v("Tags "),a("a",{staticClass:"anchor",attrs:{href:"#Tags"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Select with tags, transform input to tag (scroll the menu)")])]),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("a-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("mode")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"tags"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 100%"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"Tags Mode"')]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-for")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"i in 25"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"(i + 9).toString(36) + i"')]),t._v("\n >")]),a("span",[t._v("{{")]),t._v("(i + 9).toString(36) + i"),a("span",[t._v("}}")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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 handleChange(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("`selected "),a("span",{staticClass:"hljs-subst"},[t._v("${value}")]),t._v("`")]),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)};p._withStripped=!0;var h={methods:{handleChange:function(t){console.log("selected "+t)}}},d=Object(l.a)(h,p,[],!1,null,null,null);d.options.__file="components/select/demo/tags.md";var u=d.exports,C=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-select mode="tags" style="width: 100%" :tokenSeparators="[\',\']" @change="handleChange">\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">{{(i + 9).toString(36) + i}}</a-select-option>\n </a-select>\n',script:"\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n",style:null,us:"\n#### Automatic tokenization\nTry to copy `Lucy,Jack` to the input. Only available in tags and multiple mode.\n",cn:"\n#### 自动分词\n试下复制 `露西,杰克` 到输入框里。只在 tags 和 multiple 模式下可用。\n",sourceCode:'<template>\n <a-select mode="tags" style="width: 100%" :tokenSeparators="[\',\']" @change="handleChange">\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i"\n >{{(i + 9).toString(36) + i}}</a-select-option\n >\n </a-select>\n</template>\n<script>\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-select",{staticStyle:{width:"100%"},attrs:{mode:"tags",tokenSeparators:[","]},on:{change:t.handleChange}},t._l(25,(function(s){return a("a-select-option",{key:(s+9).toString(36)+s},[t._v(t._s((s+9).toString(36)+s))])})),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("露西,杰克")]),t._v(" 到输入框里。只在 tags 和 multiple 模式下可用。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Automatic-tokenization"}},[t._v("Automatic tokenization "),a("a",{staticClass:"anchor",attrs:{href:"#Automatic-tokenization"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Try to copy "),a("code",[t._v("Lucy,Jack")]),t._v(" to the input. Only available in tags and multiple mode.")])]),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("a-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("mode")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"tags"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 100%"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":tokenSeparators")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v("\"[',']\"")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-for")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"i in 25"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"(i + 9).toString(36) + i"')]),t._v("\n >")]),a("span",[t._v("{{")]),t._v("(i + 9).toString(36) + i"),a("span",[t._v("}}")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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 handleChange(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("`selected "),a("span",{staticClass:"hljs-subst"},[t._v("${value}")]),t._v("`")]),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)};C._withStripped=!0;var j={methods:{handleChange:function(t){console.log("selected "+t)}}},g=Object(l.a)(j,C,[],!1,null,null,null);g.options.__file="components/select/demo/automatic-tokenization.md";var m=g.exports,f=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-select labelInValue="" :defaultValue="{ key: \'lucy\' }" style="width: 120px" @change="handleChange">\n <a-select-option value="jack">Jack (100)</a-select-option>\n <a-select-option value="lucy">Lucy (101)</a-select-option>\n </a-select>\n',script:'\n export default {\n methods: {\n handleChange(value) {\n console.log(value); // { key: "lucy", label: "Lucy (101)" }\n },\n },\n };\n',style:null,us:"\n#### Get value of selected item\nAs a default behavior, the onChange callback can only get the value of the selected item. The labelInValue prop can be used to get the label property of the selected item.\nThe label of the selected item will be packed as an object for passing to the onChange callback.\n",cn:"\n#### 获得选项的文本\n默认情况下 `onChange` 里只能拿到 value如果需要拿到选中的节点文本 label可以使用 `labelInValue` 属性。\n选中项的 label 会被包装到 value 中传递给 `onChange` 等函数,此时 value 是一个对象。\n",sourceCode:'<template>\n <a-select\n labelInValue\n :defaultValue="{ key: \'lucy\' }"\n style="width: 120px"\n @change="handleChange"\n >\n <a-select-option value="jack">Jack (100)</a-select-option>\n <a-select-option value="lucy">Lucy (101)</a-select-option>\n </a-select>\n</template>\n<script>\n export default {\n methods: {\n handleChange(value) {\n console.log(value); // { key: "lucy", label: "Lucy (101)" }\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-select",{staticStyle:{width:"120px"},attrs:{labelInValue:"",defaultValue:{key:"lucy"}},on:{change:t.handleChange}},[a("a-select-option",{attrs:{value:"jack"}},[t._v("Jack (100)")]),t._v(" "),a("a-select-option",{attrs:{value:"lucy"}},[t._v("Lucy (101)")])],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("onChange")]),t._v(" 里只能拿到 value如果需要拿到选中的节点文本 label可以使用 "),a("code",[t._v("labelInValue")]),t._v(" 属性。"),a("br"),t._v("\n选中项的 label 会被包装到 value 中传递给 "),a("code",[t._v("onChange")]),t._v(" 等函数,此时 value 是一个对象。"),a("br")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Get-value-of-selected-item"}},[t._v("Get value of selected item "),a("a",{staticClass:"anchor",attrs:{href:"#Get-value-of-selected-item"}},[t._v("#")])]),t._v(" "),a("p",[t._v("As a default behavior, the onChange callback can only get the value of the selected item. The labelInValue prop can be used to get the label property of the selected item."),a("br"),t._v("\nThe label of the selected item will be packed as an object for passing to the onChange callback."),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("a-select")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("labelInValue")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v("\"{ key: 'lucy' }\"")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 120px"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"jack"')]),t._v(">")]),t._v("Jack (100)"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(">")]),t._v("Lucy (101)"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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 handleChange(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log(value); "),a("span",{staticClass:"hljs-comment"},[t._v('// { key: "lucy", label: "Lucy (101)" }')]),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)};f._withStripped=!0;var y={methods:{handleChange:function(t){console.log(t)}}},b=Object(l.a)(y,f,[],!1,null,null,null);b.options.__file="components/select/demo/label-in-value.md";var w=b.exports,x=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-select mode="multiple" :defaultValue="[\'a1\', \'b2\']" style="width: 100%" @change="handleChange" placeholder="Please select">\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">{{(i + 9).toString(36) + i}}</a-select-option>\n </a-select>\n',script:"\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n",style:null,us:"\n#### multiple selection\nMultiple selection, selecting from existing items (scroll the menu).\n",cn:"\n#### 多选\n多选从已有条目中选择scroll the menu\n",sourceCode:'<template>\n <a-select\n mode="multiple"\n :defaultValue="[\'a1\', \'b2\']"\n style="width: 100%"\n @change="handleChange"\n placeholder="Please select"\n >\n <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i"\n >{{(i + 9).toString(36) + i}}</a-select-option\n >\n </a-select>\n</template>\n<script>\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-select",{staticStyle:{width:"100%"},attrs:{mode:"multiple",defaultValue:["a1","b2"],placeholder:"Please select"},on:{change:t.handleChange}},t._l(25,(function(s){return a("a-select-option",{key:(s+9).toString(36)+s},[t._v(t._s((s+9).toString(36)+s))])})),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("多选从已有条目中选择scroll the menu")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"multiple-selection"}},[t._v("multiple selection "),a("a",{staticClass:"anchor",attrs:{href:"#multiple-selection"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Multiple selection, selecting from existing items (scroll the menu).")])]),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("a-select")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("mode")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"multiple"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v("\"['a1', 'b2']\"")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 100%"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"Please select"')]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-for")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"i in 25"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"(i + 9).toString(36) + i"')]),t._v("\n >")]),a("span",[t._v("{{")]),t._v("(i + 9).toString(36) + i"),a("span",[t._v("}}")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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 handleChange(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("`selected "),a("span",{staticClass:"hljs-subst"},[t._v("${value}")]),t._v("`")]),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)};x._withStripped=!0;var k={methods:{handleChange:function(t){console.log("selected "+t)}}},S=Object(l.a)(k,x,[],!1,null,null,null);S.options.__file="components/select/demo/multiple.md";var O=S.exports,I=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-select :defaultValue="provinceData[0]" style="width: 120px" @change="handleProvinceChange">\n <a-select-option v-for="province in provinceData" :key="province">{{province}}</a-select-option>\n </a-select>\n <a-select v-model="secondCity" style="width: 120px">\n <a-select-option v-for="city in cities" :key="city">{{city}}</a-select-option>\n </a-select>\n </div>\n',script:"\n const provinceData = ['Zhejiang', 'Jiangsu'];\n const cityData = {\n Zhejiang: ['Hangzhou', 'Ningbo', 'Wenzhou'],\n Jiangsu: ['Nanjing', 'Suzhou', 'Zhenjiang'],\n };\n export default {\n data() {\n return {\n provinceData,\n cityData,\n cities: cityData[provinceData[0]],\n secondCity: cityData[provinceData[0]][0],\n };\n },\n methods: {\n handleProvinceChange(value) {\n this.cities = cityData[value];\n this.secondCity = cityData[value][0];\n },\n },\n };\n",style:null,us:"\n#### coordinate\nCoordinating the selection of provinces and cities is a common use case and demonstrates how selection can be coordinated.\nUsing the [Cascader](/components/cascader) component is strongly recommended instead as it is more flexible and capable.\n",cn:"\n#### 联动\n省市联动是典型的例子。\n推荐使用 [Cascader](/components/cascader-cn/) 组件。\n",sourceCode:'<template>\n <div>\n <a-select :defaultValue="provinceData[0]" style="width: 120px" @change="handleProvinceChange">\n <a-select-option v-for="province in provinceData" :key="province"\n >{{province}}</a-select-option\n >\n </a-select>\n <a-select v-model="secondCity" style="width: 120px">\n <a-select-option v-for="city in cities" :key="city">{{city}}</a-select-option>\n </a-select>\n </div>\n</template>\n<script>\n const provinceData = [\'Zhejiang\', \'Jiangsu\'];\n const cityData = {\n Zhejiang: [\'Hangzhou\', \'Ningbo\', \'Wenzhou\'],\n Jiangsu: [\'Nanjing\', \'Suzhou\', \'Zhenjiang\'],\n };\n export default {\n data() {\n return {\n provinceData,\n cityData,\n cities: cityData[provinceData[0]],\n secondCity: cityData[provinceData[0]][0],\n };\n },\n methods: {\n handleProvinceChange(value) {\n this.cities = cityData[value];\n this.secondCity = cityData[value][0];\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-select",{staticStyle:{width:"120px"},attrs:{defaultValue:t.provinceData[0]},on:{change:t.handleProvinceChange}},t._l(t.provinceData,(function(s){return a("a-select-option",{key:s},[t._v(t._s(s))])})),1),t._v(" "),a("a-select",{staticStyle:{width:"120px"},model:{value:t.secondCity,callback:function(s){t.secondCity=s},expression:"secondCity"}},t._l(t.cities,(function(s){return a("a-select-option",{key:s},[t._v(t._s(s))])})),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("a",{attrs:{href:"/components/cascader-cn/"}},[t._v("Cascader")]),t._v(" 组件。"),a("br")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"coordinate"}},[t._v("coordinate "),a("a",{staticClass:"anchor",attrs:{href:"#coordinate"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Coordinating the selection of provinces and cities is a common use case and demonstrates how selection can be coordinated."),a("br"),t._v("\nUsing the "),a("a",{attrs:{href:"/components/cascader"}},[t._v("Cascader")]),t._v(" component is strongly recommended instead as it is more flexible and capable."),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-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"provinceData[0]"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 120px"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleProvinceChange"')]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-for")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"province in provinceData"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"province"')]),t._v("\n >")]),a("span",[t._v("{{")]),t._v("province"),a("span",[t._v("}}")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-model")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"secondCity"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 120px"')]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-for")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"city in cities"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"city"')]),t._v(">")]),a("span",[t._v("{{")]),t._v("city"),a("span",[t._v("}}")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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("const")]),t._v(" provinceData = ["),a("span",{staticClass:"hljs-string"},[t._v("'Zhejiang'")]),t._v(", "),a("span",{staticClass:"hljs-string"},[t._v("'Jiangsu'")]),t._v("];\n "),a("span",{staticClass:"hljs-keyword"},[t._v("const")]),t._v(" cityData = {\n "),a("span",{staticClass:"hljs-attr"},[t._v("Zhejiang")]),t._v(": ["),a("span",{staticClass:"hljs-string"},[t._v("'Hangzhou'")]),t._v(", "),a("span",{staticClass:"hljs-string"},[t._v("'Ningbo'")]),t._v(", "),a("span",{staticClass:"hljs-string"},[t._v("'Wenzhou'")]),t._v("],\n "),a("span",{staticClass:"hljs-attr"},[t._v("Jiangsu")]),t._v(": ["),a("span",{staticClass:"hljs-string"},[t._v("'Nanjing'")]),t._v(", "),a("span",{staticClass:"hljs-string"},[t._v("'Suzhou'")]),t._v(", "),a("span",{staticClass:"hljs-string"},[t._v("'Zhenjiang'")]),t._v("],\n };\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 provinceData,\n cityData,\n "),a("span",{staticClass:"hljs-attr"},[t._v("cities")]),t._v(": cityData[provinceData["),a("span",{staticClass:"hljs-number"},[t._v("0")]),t._v("]],\n "),a("span",{staticClass:"hljs-attr"},[t._v("secondCity")]),t._v(": cityData[provinceData["),a("span",{staticClass:"hljs-number"},[t._v("0")]),t._v("]]["),a("span",{staticClass:"hljs-number"},[t._v("0")]),t._v("],\n };\n },\n "),a("span",{staticClass:"hljs-attr"},[t._v("methods")]),t._v(": {\n handleProvinceChange(value) {\n "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".cities = cityData[value];\n "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".secondCity = cityData[value]["),a("span",{staticClass:"hljs-number"},[t._v("0")]),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)};I._withStripped=!0;var V=["Zhejiang","Jiangsu"],z={Zhejiang:["Hangzhou","Ningbo","Wenzhou"],Jiangsu:["Nanjing","Suzhou","Zhenjiang"]},D={data:function(){return{provinceData:V,cityData:z,cities:z[V[0]],secondCity:z[V[0]][0]}},methods:{handleProvinceChange:function(t){this.cities=z[t],this.secondCity=z[t][0]}}},F=Object(l.a)(D,I,[],!1,null,null,null);F.options.__file="components/select/demo/coordinate.md";var L=F.exports,N=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-select defaultValue="lucy" style="width: 200px" @change="handleChange">\n <a-select-opt-group>\n <span slot="label"><a-icon type="user"/>Manager</span>\n <a-select-option value="jack">Jack</a-select-option>\n <a-select-option value="lucy">Lucy</a-select-option>\n </a-select-opt-group>\n <a-select-opt-group label="Engineer">\n <a-select-option value="Yiminghe">yiminghe</a-select-option>\n </a-select-opt-group>\n </a-select>\n',script:"\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n",style:null,us:"\n#### Option Group\nUsing `OptGroup` to group the options.\n",cn:"\n#### 分组\n用 `OptGroup` 进行选项分组。\n",sourceCode:'<template>\n <a-select defaultValue="lucy" style="width: 200px" @change="handleChange">\n <a-select-opt-group>\n <span slot="label"><a-icon type="user" />Manager</span>\n <a-select-option value="jack">Jack</a-select-option>\n <a-select-option value="lucy">Lucy</a-select-option>\n </a-select-opt-group>\n <a-select-opt-group label="Engineer">\n <a-select-option value="Yiminghe">yiminghe</a-select-option>\n </a-select-opt-group>\n </a-select>\n</template>\n<script>\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-select",{staticStyle:{width:"200px"},attrs:{defaultValue:"lucy"},on:{change:t.handleChange}},[a("a-select-opt-group",[a("span",{attrs:{slot:"label"},slot:"label"},[a("a-icon",{attrs:{type:"user"}}),t._v("Manager")],1),t._v(" "),a("a-select-option",{attrs:{value:"jack"}},[t._v("Jack")]),t._v(" "),a("a-select-option",{attrs:{value:"lucy"}},[t._v("Lucy")])],1),t._v(" "),a("a-select-opt-group",{attrs:{label:"Engineer"}},[a("a-select-option",{attrs:{value:"Yiminghe"}},[t._v("yiminghe")])],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("code",[t._v("OptGroup")]),t._v(" 进行选项分组。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Option-Group"}},[t._v("Option Group "),a("a",{staticClass:"anchor",attrs:{href:"#Option-Group"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Using "),a("code",[t._v("OptGroup")]),t._v(" to group the options.")])]),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("a-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 200px"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-opt-group")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("span")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("slot")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"label"')]),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('"user"')]),t._v(" />")]),t._v("Manager"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("span")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"jack"')]),t._v(">")]),t._v("Jack"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(">")]),t._v("Lucy"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-opt-group")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-opt-group")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("label")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"Engineer"')]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"Yiminghe"')]),t._v(">")]),t._v("yiminghe"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-opt-group")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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 handleChange(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("`selected "),a("span",{staticClass:"hljs-subst"},[t._v("${value}")]),t._v("`")]),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)};N._withStripped=!0;var P={methods:{handleChange:function(t){console.log("selected "+t)}}},T=Object(l.a)(P,N,[],!1,null,null,null);T.options.__file="components/select/demo/optgroup.md";var A=T.exports,$=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-select showSearch="" :value="value" placeholder="input search text" style="width: 200px" :defaultActiveFirstOption="false" :showArrow="false" :filterOption="false" @search="handleSearch" @change="handleChange" :notFoundContent="null">\n <a-select-option v-for="d in data" :key="d.value">{{d.text}}</a-select-option>\n </a-select>\n',script:"\n import jsonp from 'fetch-jsonp';\n import querystring from 'querystring';\n\n let timeout;\n let currentValue;\n\n function fetch(value, callback) {\n if (timeout) {\n clearTimeout(timeout);\n timeout = null;\n }\n currentValue = value;\n\n function fake() {\n const str = querystring.encode({\n code: 'utf-8',\n q: value,\n });\n jsonp(`https://suggest.taobao.com/sug?${str}`)\n .then(response => response.json())\n .then(d => {\n if (currentValue === value) {\n const result = d.result;\n const data = [];\n result.forEach(r => {\n data.push({\n value: r[0],\n text: r[0],\n });\n });\n callback(data);\n }\n });\n }\n\n timeout = setTimeout(fake, 300);\n }\n export default {\n data() {\n return {\n data: [],\n value: undefined,\n };\n },\n methods: {\n handleSearch(value) {\n fetch(value, data => (this.data = data));\n },\n handleChange(value) {\n console.log(value);\n this.value = value;\n fetch(value, data => (this.data = data));\n },\n },\n };\n",style:null,us:"\n#### Search Box\nSearch with remote data.\n",cn:"\n#### 搜索框\n搜索和远程数据结合。\n",sourceCode:'<template>\n <a-select\n showSearch\n :value="value"\n placeholder="input search text"\n style="width: 200px"\n :defaultActiveFirstOption="false"\n :showArrow="false"\n :filterOption="false"\n @search="handleSearch"\n @change="handleChange"\n :notFoundContent="null"\n >\n <a-select-option v-for="d in data" :key="d.value">{{d.text}}</a-select-option>\n </a-select>\n</template>\n<script>\n import jsonp from \'fetch-jsonp\';\n import querystring from \'querystring\';\n\n let timeout;\n let currentValue;\n\n function fetch(value, callback) {\n if (timeout) {\n clearTimeout(timeout);\n timeout = null;\n }\n currentValue = value;\n\n function fake() {\n const str = querystring.encode({\n code: \'utf-8\',\n q: value,\n });\n jsonp(`https://suggest.taobao.com/sug?${str}`)\n .then(response => response.json())\n .then(d => {\n if (currentValue === value) {\n const result = d.result;\n const data = [];\n result.forEach(r => {\n data.push({\n value: r[0],\n text: r[0],\n });\n });\n callback(data);\n }\n });\n }\n\n timeout = setTimeout(fake, 300);\n }\n export default {\n data() {\n return {\n data: [],\n value: undefined,\n };\n },\n methods: {\n handleSearch(value) {\n fetch(value, data => (this.data = data));\n },\n handleChange(value) {\n console.log(value);\n this.value = value;\n fetch(value, data => (this.data = data));\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-select",{staticStyle:{width:"200px"},attrs:{showSearch:"",value:t.value,placeholder:"input search text",defaultActiveFirstOption:!1,showArrow:!1,filterOption:!1,notFoundContent:null},on:{search:t.handleSearch,change:t.handleChange}},t._l(t.data,(function(s){return a("a-select-option",{key:s.value},[t._v(t._s(s.text))])})),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("搜索和远程数据结合。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Search-Box"}},[t._v("Search Box "),a("a",{staticClass:"anchor",attrs:{href:"#Search-Box"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Search with remote data.")])]),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("a-select")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("showSearch")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"value"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"input search text"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 200px"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":defaultActiveFirstOption")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"false"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":showArrow")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"false"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":filterOption")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"false"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@search")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleSearch"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":notFoundContent")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"null"')]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-for")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"d in data"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"d.value"')]),t._v(">")]),a("span",[t._v("{{")]),t._v("d.text"),a("span",[t._v("}}")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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("import")]),t._v(" jsonp "),a("span",{staticClass:"hljs-keyword"},[t._v("from")]),t._v(" "),a("span",{staticClass:"hljs-string"},[t._v("'fetch-jsonp'")]),t._v(";\n "),a("span",{staticClass:"hljs-keyword"},[t._v("import")]),t._v(" querystring "),a("span",{staticClass:"hljs-keyword"},[t._v("from")]),t._v(" "),a("span",{staticClass:"hljs-string"},[t._v("'querystring'")]),t._v(";\n\n "),a("span",{staticClass:"hljs-keyword"},[t._v("let")]),t._v(" timeout;\n "),a("span",{staticClass:"hljs-keyword"},[t._v("let")]),t._v(" currentValue;\n\n "),a("span",{staticClass:"hljs-function"},[a("span",{staticClass:"hljs-keyword"},[t._v("function")]),t._v(" "),a("span",{staticClass:"hljs-title"},[t._v("fetch")]),t._v("("),a("span",{staticClass:"hljs-params"},[t._v("value, callback")]),t._v(") ")]),t._v("{\n "),a("span",{staticClass:"hljs-keyword"},[t._v("if")]),t._v(" (timeout) {\n clearTimeout(timeout);\n timeout = "),a("span",{staticClass:"hljs-literal"},[t._v("null")]),t._v(";\n }\n currentValue = value;\n\n "),a("span",{staticClass:"hljs-function"},[a("span",{staticClass:"hljs-keyword"},[t._v("function")]),t._v(" "),a("span",{staticClass:"hljs-title"},[t._v("fake")]),t._v("("),a("span",{staticClass:"hljs-params"}),t._v(") ")]),t._v("{\n "),a("span",{staticClass:"hljs-keyword"},[t._v("const")]),t._v(" str = querystring.encode({\n "),a("span",{staticClass:"hljs-attr"},[t._v("code")]),t._v(": "),a("span",{staticClass:"hljs-string"},[t._v("'utf-8'")]),t._v(",\n "),a("span",{staticClass:"hljs-attr"},[t._v("q")]),t._v(": value,\n });\n jsonp("),a("span",{staticClass:"hljs-string"},[t._v("`https://suggest.taobao.com/sug?"),a("span",{staticClass:"hljs-subst"},[t._v("${str}")]),t._v("`")]),t._v(")\n .then("),a("span",{staticClass:"hljs-function"},[a("span",{staticClass:"hljs-params"},[t._v("response")]),t._v(" =>")]),t._v(" response.json())\n .then("),a("span",{staticClass:"hljs-function"},[a("span",{staticClass:"hljs-params"},[t._v("d")]),t._v(" =>")]),t._v(" {\n "),a("span",{staticClass:"hljs-keyword"},[t._v("if")]),t._v(" (currentValue === value) {\n "),a("span",{staticClass:"hljs-keyword"},[t._v("const")]),t._v(" result = d.result;\n "),a("span",{staticClass:"hljs-keyword"},[t._v("const")]),t._v(" data = [];\n result.forEach("),a("span",{staticClass:"hljs-function"},[a("span",{staticClass:"hljs-params"},[t._v("r")]),t._v(" =>")]),t._v(" {\n data.push({\n "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": r["),a("span",{staticClass:"hljs-number"},[t._v("0")]),t._v("],\n "),a("span",{staticClass:"hljs-attr"},[t._v("text")]),t._v(": r["),a("span",{staticClass:"hljs-number"},[t._v("0")]),t._v("],\n });\n });\n callback(data);\n }\n });\n }\n\n timeout = setTimeout(fake, "),a("span",{staticClass:"hljs-number"},[t._v("300")]),t._v(");\n }\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("data")]),t._v(": [],\n "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),a("span",{staticClass:"hljs-literal"},[t._v("undefined")]),t._v(",\n };\n },\n "),a("span",{staticClass:"hljs-attr"},[t._v("methods")]),t._v(": {\n handleSearch(value) {\n fetch(value, data => ("),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".data = data));\n },\n handleChange(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log(value);\n "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".value = value;\n fetch(value, data => ("),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".data = data));\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)};$._withStripped=!0;var U=a(1287),J=a.n(U),E=a(1288),B=a.n(E),q=void 0,M=void 0;function G(t,s){q&&(clearTimeout(q),q=null),M=t,q=setTimeout((function(){var a=B.a.encode({code:"utf-8",q:t});J()("https://suggest.taobao.com/sug?"+a).then((function(t){return t.json()})).then((function(a){if(M===t){var e=a.result,n=[];e.forEach((function(t){n.push({value:t[0],text:t[0]})})),s(n)}}))}),300)}var R={data:function(){return{data:[],value:void 0}},methods:{handleSearch:function(t){var s=this;G(t,(function(t){return s.data=t}))},handleChange:function(t){var s=this;console.log(t),this.value=t,G(t,(function(t){return s.data=t}))}}},W=Object(l.a)(R,$,[],!1,null,null,null);W.options.__file="components/select/demo/search-box.md";var H=W.exports,Y=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-select showSearch="" placeholder="Select a person" optionFilterProp="children" style="width: 200px" @focus="handleFocus" @blur="handleBlur" @change="handleChange" :filterOption="filterOption">\n <a-select-option value="jack">Jack</a-select-option>\n <a-select-option value="lucy">Lucy</a-select-option>\n <a-select-option value="tom">Tom</a-select-option>\n </a-select>\n',script:"\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n handleBlur() {\n console.log('blur');\n },\n handleFocus() {\n console.log('focus');\n },\n filterOption(input, option) {\n return (\n option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0\n );\n },\n },\n };\n",style:null,us:"\n#### Select with search field\nSearch the options while expanded.\n",cn:"\n#### 带搜索框\n展开后可对选项进行搜索。\n",sourceCode:'<template>\n <a-select\n showSearch\n placeholder="Select a person"\n optionFilterProp="children"\n style="width: 200px"\n @focus="handleFocus"\n @blur="handleBlur"\n @change="handleChange"\n :filterOption="filterOption"\n >\n <a-select-option value="jack">Jack</a-select-option>\n <a-select-option value="lucy">Lucy</a-select-option>\n <a-select-option value="tom">Tom</a-select-option>\n </a-select>\n</template>\n<script>\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n handleBlur() {\n console.log(\'blur\');\n },\n handleFocus() {\n console.log(\'focus\');\n },\n filterOption(input, option) {\n return (\n option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0\n );\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-select",{staticStyle:{width:"200px"},attrs:{showSearch:"",placeholder:"Select a person",optionFilterProp:"children",filterOption:t.filterOption},on:{focus:t.handleFocus,blur:t.handleBlur,change:t.handleChange}},[a("a-select-option",{attrs:{value:"jack"}},[t._v("Jack")]),t._v(" "),a("a-select-option",{attrs:{value:"lucy"}},[t._v("Lucy")]),t._v(" "),a("a-select-option",{attrs:{value:"tom"}},[t._v("Tom")])],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("展开后可对选项进行搜索。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Select-with-search-field"}},[t._v("Select with search field "),a("a",{staticClass:"anchor",attrs:{href:"#Select-with-search-field"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Search the options while expanded.")])]),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("a-select")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("showSearch")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"Select a person"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("optionFilterProp")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"children"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 200px"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@focus")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleFocus"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@blur")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleBlur"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":filterOption")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"filterOption"')]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"jack"')]),t._v(">")]),t._v("Jack"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(">")]),t._v("Lucy"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"tom"')]),t._v(">")]),t._v("Tom"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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 handleChange(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("`selected "),a("span",{staticClass:"hljs-subst"},[t._v("${value}")]),t._v("`")]),t._v(");\n },\n handleBlur() {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("'blur'")]),t._v(");\n },\n handleFocus() {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("'focus'")]),t._v(");\n },\n filterOption(input, option) {\n "),a("span",{staticClass:"hljs-keyword"},[t._v("return")]),t._v(" (\n option.componentOptions.children["),a("span",{staticClass:"hljs-number"},[t._v("0")]),t._v("].text.toLowerCase().indexOf(input.toLowerCase()) >= "),a("span",{staticClass:"hljs-number"},[t._v("0")]),t._v("\n );\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)};Y._withStripped=!0;var Z={methods:{handleChange:function(t){console.log("selected "+t)},handleBlur:function(){console.log("blur")},handleFocus:function(){console.log("focus")},filterOption:function(t,s){return s.componentOptions.children[0].text.toLowerCase().indexOf(t.toLowerCase())>=0}}},K=Object(l.a)(Z,Y,[],!1,null,null,null);K.options.__file="components/select/demo/search.md";var Q=K.exports,X=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-select mode="multiple" labelInValue="" :value="value" placeholder="Select users" style="width: 100%" :filterOption="false" @search="fetchUser" @change="handleChange" :notFoundContent="fetching ? undefined : null">\n <a-spin v-if="fetching" slot="notFoundContent" size="small"/>\n <a-select-option v-for="d in data" :key="d.value">{{d.text}}</a-select-option>\n </a-select>\n',script:"\n import jsonp from 'fetch-jsonp';\n import querystring from 'querystring';\n import debounce from 'lodash/debounce';\n\n export default {\n data() {\n this.lastFetchId = 0;\n this.fetchUser = debounce(this.fetchUser, 800);\n return {\n data: [],\n value: [],\n fetching: false,\n };\n },\n methods: {\n fetchUser(value) {\n console.log('fetching user', value);\n this.lastFetchId += 1;\n const fetchId = this.lastFetchId;\n this.data = [];\n this.fetching = true;\n fetch('https://randomuser.me/api/?results=5')\n .then(response => response.json())\n .then(body => {\n if (fetchId !== this.lastFetchId) {\n // for fetch callback order\n return;\n }\n const data = body.results.map(user => ({\n text: `${user.name.first} ${user.name.last}`,\n value: user.login.username,\n }));\n this.data = data;\n this.fetching = false;\n });\n },\n handleChange(value) {\n Object.assign(this, {\n value,\n data: [],\n fetching: false,\n });\n },\n },\n };\n",style:null,us:"\n#### Search and Select Users\nA complete multiple select sample with remote search, debounce fetch, ajax callback order flow, and loading state.\n",cn:"\n#### 搜索用户\n一个带有远程搜索节流控制请求时序控制加载状态的多选示例。\n",sourceCode:'<template>\n <a-select\n mode="multiple"\n labelInValue\n :value="value"\n placeholder="Select users"\n style="width: 100%"\n :filterOption="false"\n @search="fetchUser"\n @change="handleChange"\n :notFoundContent="fetching ? undefined : null"\n >\n <a-spin v-if="fetching" slot="notFoundContent" size="small" />\n <a-select-option v-for="d in data" :key="d.value">{{d.text}}</a-select-option>\n </a-select>\n</template>\n<script>\n import jsonp from \'fetch-jsonp\';\n import querystring from \'querystring\';\n import debounce from \'lodash/debounce\';\n\n export default {\n data() {\n this.lastFetchId = 0;\n this.fetchUser = debounce(this.fetchUser, 800);\n return {\n data: [],\n value: [],\n fetching: false,\n };\n },\n methods: {\n fetchUser(value) {\n console.log(\'fetching user\', value);\n this.lastFetchId += 1;\n const fetchId = this.lastFetchId;\n this.data = [];\n this.fetching = true;\n fetch(\'https://randomuser.me/api/?results=5\')\n .then(response => response.json())\n .then(body => {\n if (fetchId !== this.lastFetchId) {\n // for fetch callback order\n return;\n }\n const data = body.results.map(user => ({\n text: `${user.name.first} ${user.name.last}`,\n value: user.login.username,\n }));\n this.data = data;\n this.fetching = false;\n });\n },\n handleChange(value) {\n Object.assign(this, {\n value,\n data: [],\n fetching: false,\n });\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-select",{staticStyle:{width:"100%"},attrs:{mode:"multiple",labelInValue:"",value:t.value,placeholder:"Select users",filterOption:!1,notFoundContent:t.fetching?void 0:null},on:{search:t.fetchUser,change:t.handleChange}},[t.fetching?a("a-spin",{attrs:{slot:"notFoundContent",size:"small"},slot:"notFoundContent"}):t._e(),t._v(" "),t._l(t.data,(function(s){return a("a-select-option",{key:s.value},[t._v(t._s(s.text))])}))],2)],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:"Search-and-Select-Users"}},[t._v("Search and Select Users "),a("a",{staticClass:"anchor",attrs:{href:"#Search-and-Select-Users"}},[t._v("#")])]),t._v(" "),a("p",[t._v("A complete multiple select sample with remote search, debounce fetch, ajax callback order flow, and loading state.")])]),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("a-select")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("mode")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"multiple"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("labelInValue")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"value"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"Select users"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 100%"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":filterOption")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"false"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@search")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"fetchUser"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":notFoundContent")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"fetching ? undefined : null"')]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-spin")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-if")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"fetching"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("slot")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"notFoundContent"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("size")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"small"')]),t._v(" />")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-for")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"d in data"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"d.value"')]),t._v(">")]),a("span",[t._v("{{")]),t._v("d.text"),a("span",[t._v("}}")]),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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("import")]),t._v(" jsonp "),a("span",{staticClass:"hljs-keyword"},[t._v("from")]),t._v(" "),a("span",{staticClass:"hljs-string"},[t._v("'fetch-jsonp'")]),t._v(";\n "),a("span",{staticClass:"hljs-keyword"},[t._v("import")]),t._v(" querystring "),a("span",{staticClass:"hljs-keyword"},[t._v("from")]),t._v(" "),a("span",{staticClass:"hljs-string"},[t._v("'querystring'")]),t._v(";\n "),a("span",{staticClass:"hljs-keyword"},[t._v("import")]),t._v(" debounce "),a("span",{staticClass:"hljs-keyword"},[t._v("from")]),t._v(" "),a("span",{staticClass:"hljs-string"},[t._v("'lodash/debounce'")]),t._v(";\n\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("this")]),t._v(".lastFetchId = "),a("span",{staticClass:"hljs-number"},[t._v("0")]),t._v(";\n "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".fetchUser = debounce("),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".fetchUser, "),a("span",{staticClass:"hljs-number"},[t._v("800")]),t._v(");\n "),a("span",{staticClass:"hljs-keyword"},[t._v("return")]),t._v(" {\n "),a("span",{staticClass:"hljs-attr"},[t._v("data")]),t._v(": [],\n "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": [],\n "),a("span",{staticClass:"hljs-attr"},[t._v("fetching")]),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 fetchUser(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("'fetching user'")]),t._v(", value);\n "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".lastFetchId += "),a("span",{staticClass:"hljs-number"},[t._v("1")]),t._v(";\n "),a("span",{staticClass:"hljs-keyword"},[t._v("const")]),t._v(" fetchId = "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".lastFetchId;\n "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".data = [];\n "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".fetching = "),a("span",{staticClass:"hljs-literal"},[t._v("true")]),t._v(";\n fetch("),a("span",{staticClass:"hljs-string"},[t._v("'https://randomuser.me/api/?results=5'")]),t._v(")\n .then("),a("span",{staticClass:"hljs-function"},[a("span",{staticClass:"hljs-params"},[t._v("response")]),t._v(" =>")]),t._v(" response.json())\n .then("),a("span",{staticClass:"hljs-function"},[a("span",{staticClass:"hljs-params"},[t._v("body")]),t._v(" =>")]),t._v(" {\n "),a("span",{staticClass:"hljs-keyword"},[t._v("if")]),t._v(" (fetchId !== "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".lastFetchId) {\n "),a("span",{staticClass:"hljs-comment"},[t._v("// for fetch callback order")]),t._v("\n "),a("span",{staticClass:"hljs-keyword"},[t._v("return")]),t._v(";\n }\n "),a("span",{staticClass:"hljs-keyword"},[t._v("const")]),t._v(" data = body.results.map("),a("span",{staticClass:"hljs-function"},[a("span",{staticClass:"hljs-params"},[t._v("user")]),t._v(" =>")]),t._v(" ({\n "),a("span",{staticClass:"hljs-attr"},[t._v("text")]),t._v(": "),a("span",{staticClass:"hljs-string"},[t._v("`"),a("span",{staticClass:"hljs-subst"},[t._v("${user.name.first}")]),t._v(" "),a("span",{staticClass:"hljs-subst"},[t._v("${user.name.last}")]),t._v("`")]),t._v(",\n "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": user.login.username,\n }));\n "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".data = data;\n "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".fetching = "),a("span",{staticClass:"hljs-literal"},[t._v("false")]),t._v(";\n });\n },\n handleChange(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("Object")]),t._v(".assign("),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(", {\n value,\n "),a("span",{staticClass:"hljs-attr"},[t._v("data")]),t._v(": [],\n "),a("span",{staticClass:"hljs-attr"},[t._v("fetching")]),t._v(": "),a("span",{staticClass:"hljs-literal"},[t._v("false")]),t._v(",\n });\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)};X._withStripped=!0;var tt=a(2),st=a.n(tt),at=a(46),et=a.n(at),nt={data:function(){return this.lastFetchId=0,this.fetchUser=et()(this.fetchUser,800),{data:[],value:[],fetching:!1}},methods:{fetchUser:function(t){var s=this;console.log("fetching user",t),this.lastFetchId+=1;var a=this.lastFetchId;this.data=[],this.fetching=!0,fetch("https://randomuser.me/api/?results=5").then((function(t){return t.json()})).then((function(t){if(a===s.lastFetchId){var e=t.results.map((function(t){return{text:t.name.first+" "+t.name.last,value:t.login.username}}));s.data=e,s.fetching=!1}}))},handleChange:function(t){st()(this,{value:t,data:[],fetching:!1})}}},lt=Object(l.a)(nt,X,[],!1,null,null,null);lt.options.__file="components/select/demo/select-users.md";var vt=lt.exports,it=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-select defaultValue="lucy" style="width: 120px" @change="handleChange">\n <a-icon slot="suffixIcon" type="smile"/>\n <a-select-option value="jack">Jack</a-select-option>\n <a-select-option value="lucy">Lucy</a-select-option>\n <a-select-option value="disabled" disabled="">Disabled</a-select-option>\n <a-select-option value="Yiminghe">yiminghe</a-select-option>\n </a-select>\n <a-select defaultValue="lucy" style="width: 120px" disabled="">\n <a-icon slot="suffixIcon" type="meh"/>\n <a-select-option value="lucy">Lucy</a-select-option>\n </a-select>\n </div>\n',script:"\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n",style:null,us:"\n#### Suffix\nBasic Usage\n",cn:"\n#### 后缀图标\n基本使用。\n",sourceCode:'<template>\n <div>\n <a-select defaultValue="lucy" style="width: 120px" @change="handleChange">\n <a-icon slot="suffixIcon" type="smile" />\n <a-select-option value="jack">Jack</a-select-option>\n <a-select-option value="lucy">Lucy</a-select-option>\n <a-select-option value="disabled" disabled>Disabled</a-select-option>\n <a-select-option value="Yiminghe">yiminghe</a-select-option>\n </a-select>\n <a-select defaultValue="lucy" style="width: 120px" disabled>\n <a-icon slot="suffixIcon" type="meh" />\n <a-select-option value="lucy">Lucy</a-select-option>\n </a-select>\n </div>\n</template>\n<script>\n export default {\n methods: {\n handleChange(value) {\n console.log(`selected ${value}`);\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("div",[a("a-select",{staticStyle:{width:"120px"},attrs:{defaultValue:"lucy"},on:{change:t.handleChange}},[a("a-icon",{attrs:{slot:"suffixIcon",type:"smile"},slot:"suffixIcon"}),t._v(" "),a("a-select-option",{attrs:{value:"jack"}},[t._v("Jack")]),t._v(" "),a("a-select-option",{attrs:{value:"lucy"}},[t._v("Lucy")]),t._v(" "),a("a-select-option",{attrs:{value:"disabled",disabled:""}},[t._v("Disabled")]),t._v(" "),a("a-select-option",{attrs:{value:"Yiminghe"}},[t._v("yiminghe")])],1),t._v(" "),a("a-select",{staticStyle:{width:"120px"},attrs:{defaultValue:"lucy",disabled:""}},[a("a-icon",{attrs:{slot:"suffixIcon",type:"meh"},slot:"suffixIcon"}),t._v(" "),a("a-select-option",{attrs:{value:"lucy"}},[t._v("Lucy")])],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("基本使用。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Suffix"}},[t._v("Suffix "),a("a",{staticClass:"anchor",attrs:{href:"#Suffix"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Basic Usage")])]),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-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 120px"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v(">")]),t._v("\n "),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("slot")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"suffixIcon"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"smile"')]),t._v(" />")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"jack"')]),t._v(">")]),t._v("Jack"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(">")]),t._v("Lucy"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"disabled"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("Disabled"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"Yiminghe"')]),t._v(">")]),t._v("yiminghe"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 120px"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(">")]),t._v("\n "),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("slot")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"suffixIcon"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"meh"')]),t._v(" />")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(">")]),t._v("Lucy"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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 handleChange(value) {\n "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),a("span",{staticClass:"hljs-string"},[t._v("`selected "),a("span",{staticClass:"hljs-subst"},[t._v("${value}")]),t._v("`")]),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)};it._withStripped=!0;var _t={methods:{handleChange:function(t){console.log("selected "+t)}}},ct=Object(l.a)(_t,it,[],!1,null,null,null);ct.options.__file="components/select/demo/suffix.md";var ot=ct.exports,rt=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-select mode="multiple" placeholder="Inserted are removed" :value="selectedItems" @change="handleChange" style="width: 100%">\n <a-select-option v-for="item in filteredOptions" :key="item" :value="item">\n {{item}}\n </a-select-option>\n </a-select>\n',script:"\n const OPTIONS = ['Apples', 'Nails', 'Bananas', 'Helicopters'];\n export default {\n data() {\n return {\n selectedItems: [],\n };\n },\n computed: {\n filteredOptions() {\n return OPTIONS.filter(o => !this.selectedItems.includes(o));\n },\n },\n methods: {\n handleChange(selectedItems) {\n this.selectedItems = selectedItems;\n },\n },\n };\n",style:null,us:"\n#### Hide Already Selected\nHide already selected options in the dropdown.\n",cn:"\n#### 隐藏已选择选项\n隐藏下拉列表中已选择的选项。\n",sourceCode:'<template>\n <a-select\n mode="multiple"\n placeholder="Inserted are removed"\n :value="selectedItems"\n @change="handleChange"\n style="width: 100%"\n >\n <a-select-option v-for="item in filteredOptions" :key="item" :value="item">\n {{item}}\n </a-select-option>\n </a-select>\n</template>\n<script>\n const OPTIONS = [\'Apples\', \'Nails\', \'Bananas\', \'Helicopters\'];\n export default {\n data() {\n return {\n selectedItems: [],\n };\n },\n computed: {\n filteredOptions() {\n return OPTIONS.filter(o => !this.selectedItems.includes(o));\n },\n },\n methods: {\n handleChange(selectedItems) {\n this.selectedItems = selectedItems;\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-select",{staticStyle:{width:"100%"},attrs:{mode:"multiple",placeholder:"Inserted are removed",value:t.selectedItems},on:{change:t.handleChange}},t._l(t.filteredOptions,(function(s){return a("a-select-option",{key:s,attrs:{value:s}},[t._v("\n "+t._s(s)+"\n ")])})),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("隐藏下拉列表中已选择的选项。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Hide-Already-Selected"}},[t._v("Hide Already Selected "),a("a",{staticClass:"anchor",attrs:{href:"#Hide-Already-Selected"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Hide already selected options in the dropdown.")])]),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("a-select")]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("mode")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"multiple"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"Inserted are removed"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v(":value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"selectedItems"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"handleChange"')]),t._v("\n "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 100%"')]),t._v("\n >")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("v-for")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"item in filteredOptions"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":key")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"item"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"item"')]),t._v(">")]),t._v("\n "),a("span",[t._v("{{")]),t._v("item"),a("span",[t._v("}}")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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("const")]),t._v(" OPTIONS = ["),a("span",{staticClass:"hljs-string"},[t._v("'Apples'")]),t._v(", "),a("span",{staticClass:"hljs-string"},[t._v("'Nails'")]),t._v(", "),a("span",{staticClass:"hljs-string"},[t._v("'Bananas'")]),t._v(", "),a("span",{staticClass:"hljs-string"},[t._v("'Helicopters'")]),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("selectedItems")]),t._v(": [],\n };\n },\n "),a("span",{staticClass:"hljs-attr"},[t._v("computed")]),t._v(": {\n filteredOptions() {\n "),a("span",{staticClass:"hljs-keyword"},[t._v("return")]),t._v(" OPTIONS.filter("),a("span",{staticClass:"hljs-function"},[a("span",{staticClass:"hljs-params"},[t._v("o")]),t._v(" =>")]),t._v(" !"),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".selectedItems.includes(o));\n },\n },\n "),a("span",{staticClass:"hljs-attr"},[t._v("methods")]),t._v(": {\n handleChange(selectedItems) {\n "),a("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".selectedItems = selectedItems;\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)};rt._withStripped=!0;var pt=["Apples","Nails","Bananas","Helicopters"],ht={data:function(){return{selectedItems:[]}},computed:{filteredOptions:function(){var t=this;return pt.filter((function(s){return!t.selectedItems.includes(s)}))}},methods:{handleChange:function(t){this.selectedItems=t}}},dt=Object(l.a)(ht,rt,[],!1,null,null,null);dt.options.__file="components/select/demo/hide-selected.md";var ut=dt.exports,Ct=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",[[a("demo-box",{attrs:{jsfiddle:{html:'\n <a-select defaultValue="lucy" style="width: 120px">\n <div slot="dropdownRender" slot-scope="menu">\n <v-nodes :vnodes="menu"/>\n <a-divider style="margin: 4px 0;"/>\n <div style="padding: 8px; cursor: pointer;"><a-icon type="plus"/> Add item</div>\n </div>\n <a-select-option value="jack">Jack</a-select-option>\n <a-select-option value="lucy">Lucy</a-select-option>\n </a-select>\n',script:"\n export default {\n data: () => ({ console: console }),\n components: {\n VNodes: {\n functional: true,\n render: (h, ctx) => ctx.props.vnodes,\n },\n },\n };\n",style:null,us:"\n#### Custom dropdown\nCustomize the dropdown menu via `dropdownRender`.\n",cn:"\n#### 扩展菜单\n使用 `dropdownRender` 对下拉菜单进行自由扩展。\n",sourceCode:'<template>\n <a-select defaultValue="lucy" style="width: 120px">\n <div slot="dropdownRender" slot-scope="menu">\n <v-nodes :vnodes="menu" />\n <a-divider style="margin: 4px 0;" />\n <div style="padding: 8px; cursor: pointer;"><a-icon type="plus" /> Add item</div>\n </div>\n <a-select-option value="jack">Jack</a-select-option>\n <a-select-option value="lucy">Lucy</a-select-option>\n </a-select>\n</template>\n<script>\n export default {\n data: () => ({ console: console }),\n components: {\n VNodes: {\n functional: true,\n render: (h, ctx) => ctx.props.vnodes,\n },\n },\n };\n<\/script>\n'}}},[a("template",{slot:"component"},[a("a-select",{staticStyle:{width:"120px"},attrs:{defaultValue:"lucy"},scopedSlots:t._u([{key:"dropdownRender",fn:function(s){return a("div",{},[a("v-nodes",{attrs:{vnodes:s}}),t._v(" "),a("a-divider",{staticStyle:{margin:"4px 0"}}),t._v(" "),a("div",{staticStyle:{padding:"8px",cursor:"pointer"}},[a("a-icon",{attrs:{type:"plus"}}),t._v(" Add item")],1)],1)}}])},[t._v(" "),a("a-select-option",{attrs:{value:"jack"}},[t._v("Jack")]),t._v(" "),a("a-select-option",{attrs:{value:"lucy"}},[t._v("Lucy")])],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("dropdownRender")]),t._v(" 对下拉菜单进行自由扩展。")])]),t._v(" "),a("template",{slot:"us-description"},[a("h4",{attrs:{id:"Custom-dropdown"}},[t._v("Custom dropdown "),a("a",{staticClass:"anchor",attrs:{href:"#Custom-dropdown"}},[t._v("#")])]),t._v(" "),a("p",[t._v("Customize the dropdown menu via "),a("code",[t._v("dropdownRender")]),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("a-select")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("defaultValue")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"width: 120px"')]),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("slot")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"dropdownRender"')]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("slot-scope")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"menu"')]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("v-nodes")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v(":vnodes")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"menu"')]),t._v(" />")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-divider")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"margin: 4px 0;"')]),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; cursor: pointer;"')]),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('"plus"')]),t._v(" />")]),t._v(" Add item"),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("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"jack"')]),t._v(">")]),t._v("Jack"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("<"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(" "),a("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),a("span",{staticClass:"hljs-string"},[t._v('"lucy"')]),t._v(">")]),t._v("Lucy"),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select-option")]),t._v(">")]),t._v("\n "),a("span",{staticClass:"hljs-tag"},[t._v("</"),a("span",{staticClass:"hljs-name"},[t._v("a-select")]),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("data")]),t._v(": "),a("span",{staticClass:"hljs-function"},[a("span",{staticClass:"hljs-params"},[t._v("()")]),t._v(" =>")]),t._v(" ({ "),a("span",{staticClass:"hljs-attr"},[t._v("console")]),t._v(": "),a("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(" }),\n "),a("span",{staticClass:"hljs-attr"},[t._v("components")]),t._v(": {\n "),a("span",{staticClass:"hljs-attr"},[t._v("VNodes")]),t._v(": {\n "),a("span",{staticClass:"hljs-attr"},[t._v("functional")]),t._v(": "),a("span",{staticClass:"hljs-literal"},[t._v("true")]),t._v(",\n "),a("span",{staticClass:"hljs-attr"},[t._v("render")]),t._v(": "),a("span",{staticClass:"hljs-function"},[t._v("("),a("span",{staticClass:"hljs-params"},[t._v("h, ctx")]),t._v(") =>")]),t._v(" ctx.props.vnodes,\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)};Ct._withStripped=!0;var jt={data:function(){return{console:console}},components:{VNodes:{functional:!0,render:function(t,s){return s.props.vnodes}}}},gt=Object(l.a)(jt,Ct,[],!1,null,null,null);gt.options.__file="components/select/demo/custom-dropdown-menu.md";var mt=gt.exports,ft=function(){var t=this.$createElement;this._self._c;return this._m(0)};ft._withStripped=!0;var yt=Object(l.a)({},ft,[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("pre",{pre:!0},[a("code",{pre:!0,attrs:{"v-pre":"",class:"language-html"}},[a("span",{pre:!0,attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{pre:!0,attrs:{class:"hljs-name"}},[t._v("a-select")]),t._v(">")]),t._v("\n "),a("span",{pre:!0,attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{pre:!0,attrs:{class:"hljs-name"}},[t._v("a-select-option")]),t._v(" "),a("span",{pre:!0,attrs:{class:"hljs-attr"}},[t._v("value")]),t._v("="),a("span",{pre:!0,attrs:{class:"hljs-string"}},[t._v('"lucy"')]),t._v(">")]),t._v("lucy"),a("span",{pre:!0,attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{pre:!0,attrs:{class:"hljs-name"}},[t._v("a-select-option")]),t._v(">")]),t._v("\n"),a("span",{pre:!0,attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{pre:!0,attrs:{class:"hljs-name"}},[t._v("a-select")]),t._v(">")]),t._v("\n")])]),t._v(" "),a("h3",{attrs:{id:"Select-props"}},[t._v("Select props "),a("a",{staticClass:"anchor",attrs:{href:"#Select-props"}},[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("allowClear")]),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("autoClearSearchValue")]),t._v(" "),a("td",[t._v("是否在选中项后清空搜索框,只在 "),a("code",{pre:!0},[t._v("mode")]),t._v(" 为 "),a("code",{pre:!0},[t._v("multiple")]),t._v(" 或 "),a("code",{pre:!0},[t._v("tags")]),t._v(" 时有效。")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("true")])]),t._v(" "),a("tr",[a("td",[t._v("autoFocus")]),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("defaultActiveFirstOption")]),t._v(" "),a("td",[t._v("是否默认高亮第一个选项。")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("true")])]),t._v(" "),a("tr",[a("td",[t._v("defaultValue")]),t._v(" "),a("td",[t._v("指定默认选中的条目")]),t._v(" "),a("td",[t._v("string|string[]|number|number[]")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("disabled")]),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("dropdownClassName")]),t._v(" "),a("td",[t._v("下拉菜单的 className 属性")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("dropdownMatchSelectWidth")]),t._v(" "),a("td",[t._v("下拉菜单和选择器同宽")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("true")])]),t._v(" "),a("tr",[a("td",[t._v("dropdownRender")]),t._v(" "),a("td",[t._v("自定义下拉框内容")]),t._v(" "),a("td",[t._v("(menuNode: VNode, props) => VNode")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("dropdownStyle")]),t._v(" "),a("td",[t._v("下拉菜单的 style 属性")]),t._v(" "),a("td",[t._v("object")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("filterOption")]),t._v(" "),a("td",[t._v("是否根据输入项进行筛选。当其为一个函数时,会接收 "),a("code",{pre:!0},[t._v("inputValue")]),t._v(" "),a("code",{pre:!0},[t._v("option")]),t._v(" 两个参数,当 "),a("code",{pre:!0},[t._v("option")]),t._v(" 符合筛选条件时,应返回 "),a("code",{pre:!0},[t._v("true")]),t._v(",反之则返回 "),a("code",{pre:!0},[t._v("false")]),t._v("。")]),t._v(" "),a("td",[t._v("boolean or function(inputValue, option)")]),t._v(" "),a("td",[t._v("true")])]),t._v(" "),a("tr",[a("td",[t._v("firstActiveValue")]),t._v(" "),a("td",[t._v("默认高亮的选项")]),t._v(" "),a("td",[t._v("string|string[]")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("getPopupContainer")]),t._v(" "),a("td",[t._v("菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位。")]),t._v(" "),a("td",[t._v("Function(triggerNode)")]),t._v(" "),a("td",[t._v("() => document.body")])]),t._v(" "),a("tr",[a("td",[t._v("labelInValue")]),t._v(" "),a("td",[t._v("是否把每个选项的 label 包装到 value 中,会把 Select 的 value 类型从 "),a("code",{pre:!0},[t._v("string")]),t._v(" 变为 "),a("code",{pre:!0},[t._v("{key: string, label: vNodes}")]),t._v(" 的格式")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("maxTagCount")]),t._v(" "),a("td",[t._v("最多显示多少个 tag")]),t._v(" "),a("td",[t._v("number")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("maxTagPlaceholder")]),t._v(" "),a("td",[t._v("隐藏 tag 时显示的内容")]),t._v(" "),a("td",[t._v("slot/function(omittedValues)")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("maxTagTextLength")]),t._v(" "),a("td",[t._v("最大显示的 tag 文本长度")]),t._v(" "),a("td",[t._v("number")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("mode")]),t._v(" "),a("td",[t._v("设置 Select 的模式为多选或标签")]),t._v(" "),a("td",[t._v("'default' | 'multiple' | 'tags' | 'combobox'")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("notFoundContent")]),t._v(" "),a("td",[t._v("当下拉列表为空时显示的内容")]),t._v(" "),a("td",[t._v("string|slot")]),t._v(" "),a("td",[t._v("'Not Found'")])]),t._v(" "),a("tr",[a("td",[t._v("optionFilterProp")]),t._v(" "),a("td",[t._v("搜索时过滤对应的 option 属性,如设置为 children 表示对内嵌内容进行搜索")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("value")])]),t._v(" "),a("tr",[a("td",[t._v("optionLabelProp")]),t._v(" "),a("td",[t._v("回填到选择框的 Option 的属性值,默认是 Option 的子元素。比如在子元素需要高亮效果时,此值可以设为 "),a("code",{pre:!0},[t._v("value")]),t._v("。")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("children")]),t._v(" combobox 模式下为 "),a("code",{pre:!0},[t._v("value")]),t._v("")])]),t._v(" "),a("tr",[a("td",[t._v("placeholder")]),t._v(" "),a("td",[t._v("选择框默认文字")]),t._v(" "),a("td",[t._v("string|slot")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("showSearch")]),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("showArrow")]),t._v(" "),a("td",[t._v("是否显示下拉小箭头")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("true")])]),t._v(" "),a("tr",[a("td",[t._v("size")]),t._v(" "),a("td",[t._v("选择框大小,可选 "),a("code",{pre:!0},[t._v("large")]),t._v(" "),a("code",{pre:!0},[t._v("small")])]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("default")])]),t._v(" "),a("tr",[a("td",[t._v("suffixIcon")]),t._v(" "),a("td",[t._v("自定义的选择框后缀图标")]),t._v(" "),a("td",[t._v("VNode | slot")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("removeIcon")]),t._v(" "),a("td",[t._v("自定义的多选框清除图标")]),t._v(" "),a("td",[t._v("VNode | slot")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("clearIcon")]),t._v(" "),a("td",[t._v("自定义的多选框清空图标")]),t._v(" "),a("td",[t._v("VNode | slot")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("menuItemSelectedIcon")]),t._v(" "),a("td",[t._v("自定义当前选中的条目图标")]),t._v(" "),a("td",[t._v("VNode | slot")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("tokenSeparators")]),t._v(" "),a("td",[t._v("在 tags 和 multiple 模式下自动分词的分隔符")]),t._v(" "),a("td",[t._v("string[]")]),t._v(" "),a("td")]),t._v(" "),a("tr",[a("td",[t._v("value(v-model)")]),t._v(" "),a("td",[t._v("指定当前选中的条目")]),t._v(" "),a("td",[t._v("string|string[]|number|number[]")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("options")]),t._v(" "),a("td",[t._v("options 数据,如果设置则不需要手动构造 selectOption 节点")]),t._v(" "),a("td",[t._v("array<{value, label, [disabled, key, title]}>")]),t._v(" "),a("td",[t._v("[]")])]),t._v(" "),a("tr",[a("td",[t._v("defaultOpen")]),t._v(" "),a("td",[t._v("是否默认展开下拉菜单")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("open")]),t._v(" "),a("td",[t._v("是否展开下拉菜单")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("-")])])])]),t._v(" "),a("blockquote",[a("p",[t._v("注意,如果发现下拉菜单跟随页面滚动,或者需要在其他弹层中触发 Select请尝试使用 "),a("code",{pre:!0},[t._v("getPopupContainer={triggerNode => triggerNode.parentNode}")]),t._v(" 将下拉弹层渲染节点固定在触发器的父元素中。")])]),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("blur")]),t._v(" "),a("td",[t._v("失去焦点的时回调")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("change")]),t._v(" "),a("td",[t._v("选中 option或 input 的 value 变化combobox 模式下)时,调用此函数")]),t._v(" "),a("td",[t._v("function(value, option:Option/Array<Option>)")])]),t._v(" "),a("tr",[a("td",[t._v("deselect")]),t._v(" "),a("td",[t._v("取消选中时调用,参数为选中项的 value (或 key) 值,仅在 multiple 或 tags 模式下生效")]),t._v(" "),a("td",[t._v("function(valueoption:Option)")])]),t._v(" "),a("tr",[a("td",[t._v("focus")]),t._v(" "),a("td",[t._v("获得焦点时回调")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("inputKeydown")]),t._v(" "),a("td",[t._v("键盘按下时回调")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("mouseenter")]),t._v(" "),a("td",[t._v("鼠标移入时回调")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("mouseleave")]),t._v(" "),a("td",[t._v("鼠标移出时回调")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("popupScroll")]),t._v(" "),a("td",[t._v("下拉列表滚动时的回调")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("search")]),t._v(" "),a("td",[t._v("文本框值变化时回调")]),t._v(" "),a("td",[t._v("function(value: string)")])]),t._v(" "),a("tr",[a("td",[t._v("select")]),t._v(" "),a("td",[t._v("被选中时调用,参数为选中项的 value (或 key) 值")]),t._v(" "),a("td",[t._v("function(value, option:Option)")])]),t._v(" "),a("tr",[a("td",[t._v("dropdownVisibleChange")]),t._v(" "),a("td",[t._v("展开下拉菜单的回调")]),t._v(" "),a("td",[t._v("function(open)")])])])]),t._v(" "),a("h3",{attrs:{id:"Select-Methods"}},[t._v("Select Methods "),a("a",{staticClass:"anchor",attrs:{href:"#Select-Methods"}},[t._v("#")])]),t._v(" "),a("table",[a("thead",[a("tr",[a("th",[t._v("名称")]),t._v(" "),a("th",[t._v("说明")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("blur()")]),t._v(" "),a("td",[t._v("取消焦点")])]),t._v(" "),a("tr",[a("td",[t._v("focus()")]),t._v(" "),a("td",[t._v("获取焦点")])])])]),t._v(" "),a("h3",{attrs:{id:"Option-props"}},[t._v("Option props "),a("a",{staticClass:"anchor",attrs:{href:"#Option-props"}},[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",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("key")]),t._v(" "),a("td",[t._v("和 value 含义一致。如果 Vue 需要你设置此项,此项值与 value 的值相同,然后可以省略 value 设置")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td")]),t._v(" "),a("tr",[a("td",[t._v("title")]),t._v(" "),a("td",[t._v("选中该 Option 后Select 的 title")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("value")]),t._v(" "),a("td",[t._v("默认根据此属性值进行筛选")]),t._v(" "),a("td",[t._v("string|number")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("class")]),t._v(" "),a("td",[t._v("Option 器类名")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])])])]),t._v(" "),a("h3",{attrs:{id:"OptGroup-props"}},[t._v("OptGroup props "),a("a",{staticClass:"anchor",attrs:{href:"#OptGroup-props"}},[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("key")]),t._v(" "),a("td"),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("label")]),t._v(" "),a("td",[t._v("组名")]),t._v(" "),a("td",[t._v("string||function(h)|slot")]),t._v(" "),a("td",[t._v("无")])])])])])}],!1,null,null,null);yt.options.__file="components/select/index.zh-CN.md";var bt=yt.exports,wt=function(){var t=this.$createElement;this._self._c;return this._m(0)};wt._withStripped=!0;var xt=Object(l.a)({},wt,[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("pre",{pre:!0},[a("code",{pre:!0,attrs:{"v-pre":"",class:"language-html"}},[a("span",{pre:!0,attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{pre:!0,attrs:{class:"hljs-name"}},[t._v("a-select")]),t._v(">")]),t._v("\n "),a("span",{pre:!0,attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{pre:!0,attrs:{class:"hljs-name"}},[t._v("a-select-option")]),t._v(" "),a("span",{pre:!0,attrs:{class:"hljs-attr"}},[t._v("value")]),t._v("="),a("span",{pre:!0,attrs:{class:"hljs-string"}},[t._v('"lucy"')]),t._v(">")]),t._v("lucy"),a("span",{pre:!0,attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{pre:!0,attrs:{class:"hljs-name"}},[t._v("a-select-option")]),t._v(">")]),t._v("\n"),a("span",{pre:!0,attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{pre:!0,attrs:{class:"hljs-name"}},[t._v("a-select")]),t._v(">")]),t._v("\n")])]),t._v(" "),a("h3",{attrs:{id:"Select-props"}},[t._v("Select props "),a("a",{staticClass:"anchor",attrs:{href:"#Select-props"}},[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("allowClear")]),t._v(" "),a("td",[t._v("Show clear button.")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("autoClearSearchValue")]),t._v(" "),a("td",[t._v("Whether the current search will be cleared on selecting an item. Only applies when "),a("code",{pre:!0},[t._v("mode")]),t._v(" is set to "),a("code",{pre:!0},[t._v("multiple")]),t._v(" or "),a("code",{pre:!0},[t._v("tags")]),t._v(".")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("true")])]),t._v(" "),a("tr",[a("td",[t._v("autoFocus")]),t._v(" "),a("td",[t._v("Get focus by default")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("defaultActiveFirstOption")]),t._v(" "),a("td",[t._v("Whether active first option by default")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("true")])]),t._v(" "),a("tr",[a("td",[t._v("defaultValue")]),t._v(" "),a("td",[t._v("Initial selected option.")]),t._v(" "),a("td",[t._v("string|string[]"),a("br"),t._v("number|number[]")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("disabled")]),t._v(" "),a("td",[t._v("Whether disabled select")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("dropdownClassName")]),t._v(" "),a("td",[t._v("className of dropdown menu")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("dropdownMatchSelectWidth")]),t._v(" "),a("td",[t._v("Whether dropdown's width is same with select.")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("true")])]),t._v(" "),a("tr",[a("td",[t._v("dropdownRender")]),t._v(" "),a("td",[t._v("Customize dropdown content")]),t._v(" "),a("td",[t._v("(menuNode: VNode, props) => VNode")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("dropdownStyle")]),t._v(" "),a("td",[t._v("style of dropdown menu")]),t._v(" "),a("td",[t._v("object")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("filterOption")]),t._v(" "),a("td",[t._v("If true, filter options by input, if function, filter options against it. The function will receive two arguments, "),a("code",{pre:!0},[t._v("inputValue")]),t._v(" and "),a("code",{pre:!0},[t._v("option")]),t._v(", if the function returns "),a("code",{pre:!0},[t._v("true")]),t._v(", the option will be included in the filtered set; Otherwise, it will be excluded.")]),t._v(" "),a("td",[t._v("boolean or function(inputValue, option)")]),t._v(" "),a("td",[t._v("true")])]),t._v(" "),a("tr",[a("td",[t._v("firstActiveValue")]),t._v(" "),a("td",[t._v("Value of action option by default")]),t._v(" "),a("td",[t._v("string|string[]")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("getPopupContainer")]),t._v(" "),a("td",[t._v("Parent Node which the selector should be rendered to. Default to "),a("code",{pre:!0},[t._v("body")]),t._v(". When position issues happen, try to modify it into scrollable content and position it relative.")]),t._v(" "),a("td",[t._v("function(triggerNode)")]),t._v(" "),a("td",[t._v("() => document.body")])]),t._v(" "),a("tr",[a("td",[t._v("labelInValue")]),t._v(" "),a("td",[t._v("whether to embed label in value, turn the format of value from "),a("code",{pre:!0},[t._v("string")]),t._v(" to "),a("code",{pre:!0},[t._v("{key: string, label: vNodes}")])]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("maxTagCount")]),t._v(" "),a("td",[t._v("Max tag count to show")]),t._v(" "),a("td",[t._v("number")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("maxTagPlaceholder")]),t._v(" "),a("td",[t._v("Placeholder for not showing tags")]),t._v(" "),a("td",[t._v("slot/function(omittedValues)")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("maxTagTextLength")]),t._v(" "),a("td",[t._v("Max text length to show")]),t._v(" "),a("td",[t._v("number")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("mode")]),t._v(" "),a("td",[t._v("Set mode of Select")]),t._v(" "),a("td",[t._v("'default' | 'multiple' | 'tags'")]),t._v(" "),a("td",[t._v("'default'")])]),t._v(" "),a("tr",[a("td",[t._v("notFoundContent")]),t._v(" "),a("td",[t._v("Specify content to show when no result matches..")]),t._v(" "),a("td",[t._v("string|slot")]),t._v(" "),a("td",[t._v("'Not Found'")])]),t._v(" "),a("tr",[a("td",[t._v("optionFilterProp")]),t._v(" "),a("td",[t._v("Which prop value of option will be used for filter if filterOption is true")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("value")])]),t._v(" "),a("tr",[a("td",[t._v("optionLabelProp")]),t._v(" "),a("td",[t._v("Which prop value of option will render as content of select.")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("value")]),t._v(" for "),a("code",{pre:!0},[t._v("combobox")]),t._v(", "),a("code",{pre:!0},[t._v("children")]),t._v(" for other modes")])]),t._v(" "),a("tr",[a("td",[t._v("placeholder")]),t._v(" "),a("td",[t._v("Placeholder of select")]),t._v(" "),a("td",[t._v("string|slot")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("showSearch")]),t._v(" "),a("td",[t._v("Whether show search input in single mode.")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("showArrow")]),t._v(" "),a("td",[t._v("Whether to show the drop-down arrow")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("true")])]),t._v(" "),a("tr",[a("td",[t._v("size")]),t._v(" "),a("td",[t._v("Size of Select input. "),a("code",{pre:!0},[t._v("default")]),t._v(" "),a("code",{pre:!0},[t._v("large")]),t._v(" "),a("code",{pre:!0},[t._v("small")])]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("default")])]),t._v(" "),a("tr",[a("td",[t._v("suffixIcon")]),t._v(" "),a("td",[t._v("The custom suffix icon")]),t._v(" "),a("td",[t._v("VNode | slot")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("removeIcon")]),t._v(" "),a("td",[t._v("The custom remove icon")]),t._v(" "),a("td",[t._v("VNode | slot")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("clearIcon")]),t._v(" "),a("td",[t._v("The custom clear icon")]),t._v(" "),a("td",[t._v("VNode | slot")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("menuItemSelectedIcon")]),t._v(" "),a("td",[t._v("The custom menuItemSelected icon")]),t._v(" "),a("td",[t._v("VNode | slot")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("tokenSeparators")]),t._v(" "),a("td",[t._v("Separator used to tokenize on tag/multiple mode")]),t._v(" "),a("td",[t._v("string[]")]),t._v(" "),a("td")]),t._v(" "),a("tr",[a("td",[t._v("value(v-model)")]),t._v(" "),a("td",[t._v("Current selected option.")]),t._v(" "),a("td",[t._v("string|number|string[]|number[]")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("options")]),t._v(" "),a("td",[t._v("Data of the selectOption, manual construction work is no longer needed if this property has been set")]),t._v(" "),a("td",[t._v("array<{value, label, [disabled, key, title]}>")]),t._v(" "),a("td",[t._v("[]")])]),t._v(" "),a("tr",[a("td",[t._v("defaultOpen")]),t._v(" "),a("td",[t._v("Initial open state of dropdown")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("open")]),t._v(" "),a("td",[t._v("Controlled open state of dropdown")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("loading")]),t._v(" "),a("td",[t._v("indicate loading state")]),t._v(" "),a("td",[t._v("Boolean")]),t._v(" "),a("td",[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("blur")]),t._v(" "),a("td",[t._v("Called when blur")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("change")]),t._v(" "),a("td",[t._v("Called when select an option or input value change, or value of input is changed in combobox mode")]),t._v(" "),a("td",[t._v("function(value, option:Option/Array<Option>)")])]),t._v(" "),a("tr",[a("td",[t._v("deselect")]),t._v(" "),a("td",[t._v("Called when a option is deselected, the params are option's value (or key) . only called for multiple or tags, effective in multiple or tags mode only.")]),t._v(" "),a("td",[t._v("function(value, option:Option)")])]),t._v(" "),a("tr",[a("td",[t._v("focus")]),t._v(" "),a("td",[t._v("Called when focus")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("inputKeydown")]),t._v(" "),a("td",[t._v("Called when key pressed")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("mouseenter")]),t._v(" "),a("td",[t._v("Called when mouse enter")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("mouseleave")]),t._v(" "),a("td",[t._v("Called when mouse leave")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("popupScroll")]),t._v(" "),a("td",[t._v("Called when dropdown scrolls")]),t._v(" "),a("td",[t._v("function")])]),t._v(" "),a("tr",[a("td",[t._v("search")]),t._v(" "),a("td",[t._v("Callback function that is fired when input changed.")]),t._v(" "),a("td",[t._v("function(value: string)")])]),t._v(" "),a("tr",[a("td",[t._v("select")]),t._v(" "),a("td",[t._v("Called when a option is selected, the params are option's value (or key) and option instance.")]),t._v(" "),a("td",[t._v("function(value, option:Option)")])]),t._v(" "),a("tr",[a("td",[t._v("dropdownVisibleChange")]),t._v(" "),a("td",[t._v("Call when dropdown open")]),t._v(" "),a("td",[t._v("function(open)")])])])]),t._v(" "),a("h3",{attrs:{id:"Select-Methods"}},[t._v("Select Methods "),a("a",{staticClass:"anchor",attrs:{href:"#Select-Methods"}},[t._v("#")])]),t._v(" "),a("table",[a("thead",[a("tr",[a("th",[t._v("Name")]),t._v(" "),a("th",[t._v("Description")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("blur()")]),t._v(" "),a("td",[t._v("Remove focus")])]),t._v(" "),a("tr",[a("td",[t._v("focus()")]),t._v(" "),a("td",[t._v("Get focus")])])])]),t._v(" "),a("h3",{attrs:{id:"Option-props"}},[t._v("Option props "),a("a",{staticClass:"anchor",attrs:{href:"#Option-props"}},[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("Disable this option")]),t._v(" "),a("td",[t._v("boolean")]),t._v(" "),a("td",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("key")]),t._v(" "),a("td",[t._v("Same usage as "),a("code",{pre:!0},[t._v("value")]),t._v(". If Vue request you to set this property, you can set it to value of option, and then omit value property.")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td")]),t._v(" "),a("tr",[a("td",[t._v("title")]),t._v(" "),a("td",[a("code",{pre:!0},[t._v("title")]),t._v(" of Select after select this Option")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("value")]),t._v(" "),a("td",[t._v("default to filter with this property")]),t._v(" "),a("td",[t._v("string|number")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("class")]),t._v(" "),a("td",[t._v("additional class to option")]),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])])])]),t._v(" "),a("h3",{attrs:{id:"OptGroup-props"}},[t._v("OptGroup props "),a("a",{staticClass:"anchor",attrs:{href:"#OptGroup-props"}},[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("key")]),t._v(" "),a("td"),t._v(" "),a("td",[t._v("string")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("label")]),t._v(" "),a("td",[t._v("Group label")]),t._v(" "),a("td",[t._v("string|slot")]),t._v(" "),a("td",[t._v("-")])])])])])}],!1,null,null,null);xt.options.__file="components/select/index.en-US.md";var kt=xt.exports,St="# Select 选择器\n 下拉选择器。\n ## 何时使用\n - 弹出一个下拉菜单给用户选择操作,用于代替原生的选择器,或者需要一个更优雅的多选器时。\n - 当选项少时(少于 5 项),建议直接将选项平铺,使用 [Radio](/ant-design/components/radio-cn/) 是更好的选择。\n\n ## 代码演示",Ot="# Select\n Select component to select value from options.\n ## When To Use\n - A dropdown menu for displaying choices - an elegant alternative to the native `<select>` element.\n - Utilizing [Radio](/ant-design/components/radio/) is recommended when there are fewer total options (less than 5).\n ## Examples ",It={category:"Components",subtitle:"选择器",type:"Data Entry",title:"Select",render:function(){var t=arguments[0];return t("div",{attrs:{id:"components-select-demo"}},[t("md",{attrs:{cn:St,us:Ot}}),t(i),t(r),t(u),t(m),t(w),t(O),t(L),t(A),t(H),t(Q),t(vt),t(ot),t(ut),t(mt),t("api",[t(bt,{slot:"cn"}),t(kt)])])}},Vt=(a(1309),Object(l.a)(It,void 0,void 0,!1,null,null,null));Vt.options.__file="components/select/demo/index.vue";s.default=Vt.exports}}]);