123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829 |
- import{d as h,r as m,_ as A,j as p,k as b,l as y,w as o,b as n,f as e,e as t,s as S,B as P,c as j,H as L,b8 as E,b3 as Q,O as M,P as $,t as K,a as U,n as T}from"./index.c1b9962e.js";import{U as _}from"./UserOutlined.f4b09e7f.js";import{M as nn}from"./MehOutlined.9864ea87.js";import{S as tn}from"./SmileOutlined.8742fd55.js";const an=h({setup(){const s=m([{value:"jack",label:"Jack"},{value:"lucy",label:"Lucy"},{value:"disabled",label:"Disabled",disabled:!0},{value:"yiminghe",label:"Yiminghe"}]),a=m([{value:"lucy",label:"Lucy"}]),l=m([{value:"lucy",label:"Lucy"}]);return{focus:()=>{console.log("focus")},handleChange:g=>{console.log(`selected ${g}`)},value1:m("lucy"),value2:m("lucy"),value3:m("lucy"),options1:s,options2:a,options3:l}}});function sn(s,a,l,d,i,g){const c=p("a-select-option"),u=p("a-select"),k=p("a-space"),C=p("demo-box");return b(),y(C,{jsfiddle:{us:"Basic Usage",cn:"\u57FA\u672C\u4F7F\u7528\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u57FA\u672C\u4F7F\u7528\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>Basic Usage</p>
- `,order:0,title:{"zh-CN":"\u57FA\u672C\u4F7F\u7528","en-US":"Basic Usage"},relativePath:"src/docs/select/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxoMj51c2UgYS1zZWxlY3Qtb3B0aW9uPC9oMj4KICA8YS1zcGFjZT4KICAgIDxhLXNlbGVjdAogICAgICByZWY9InNlbGVjdCIKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIgogICAgICBzdHlsZT0id2lkdGg6IDEyMHB4IgogICAgICBAZm9jdXM9ImZvY3VzIgogICAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgICA+CiAgICAgIDxhLXNlbGVjdC1vcHRpb24gdmFsdWU9ImphY2siPkphY2s8L2Etc2VsZWN0LW9wdGlvbj4KICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0ibHVjeSI+THVjeTwvYS1zZWxlY3Qtb3B0aW9uPgogICAgICA8YS1zZWxlY3Qtb3B0aW9uIHZhbHVlPSJkaXNhYmxlZCIgZGlzYWJsZWQ+RGlzYWJsZWQ8L2Etc2VsZWN0LW9wdGlvbj4KICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0iWWltaW5naGUiPnlpbWluZ2hlPC9hLXNlbGVjdC1vcHRpb24+CiAgICA8L2Etc2VsZWN0PgogICAgPGEtc2VsZWN0IHYtbW9kZWw6dmFsdWU9InZhbHVlMiIgc3R5bGU9IndpZHRoOiAxMjBweCIgZGlzYWJsZWQ+CiAgICAgIDxhLXNlbGVjdC1vcHRpb24gdmFsdWU9Imx1Y3kiPkx1Y3k8L2Etc2VsZWN0LW9wdGlvbj4KICAgIDwvYS1zZWxlY3Q+CiAgICA8YS1zZWxlY3Qgdi1tb2RlbDp2YWx1ZT0idmFsdWUzIiBzdHlsZT0id2lkdGg6IDEyMHB4IiBsb2FkaW5nPgogICAgICA8YS1zZWxlY3Qtb3B0aW9uIHZhbHVlPSJsdWN5Ij5MdWN5PC9hLXNlbGVjdC1vcHRpb24+CiAgICA8L2Etc2VsZWN0PgogIDwvYS1zcGFjZT4KICA8aDIgc3R5bGU9Im1hcmdpbi10b3A6IDEwcHgiPnVzZSBvcHRpb25zIChyZWNvbW1lbmQpPC9oMj4KICA8YS1zcGFjZT4KICAgIDxhLXNlbGVjdAogICAgICByZWY9InNlbGVjdCIKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIgogICAgICBzdHlsZT0id2lkdGg6IDEyMHB4IgogICAgICA6b3B0aW9ucz0ib3B0aW9uczEiCiAgICAgIEBmb2N1cz0iZm9jdXMiCiAgICAgIEBjaGFuZ2U9ImhhbmRsZUNoYW5nZSIKICAgID4KICAgIDwvYS1zZWxlY3Q+CiAgICA8YS1zZWxlY3Qgdi1tb2RlbDp2YWx1ZT0idmFsdWUyIiBzdHlsZT0id2lkdGg6IDEyMHB4IiBkaXNhYmxlZCA6b3B0aW9ucz0ib3B0aW9uczIiPjwvYS1zZWxlY3Q+CiAgICA8YS1zZWxlY3Qgdi1tb2RlbDp2YWx1ZT0idmFsdWUzIiBzdHlsZT0id2lkdGg6IDEyMHB4IiBsb2FkaW5nIDpvcHRpb25zPSJvcHRpb25zMyI+PC9hLXNlbGVjdD4KICA8L2Etc3BhY2U+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBTZWxlY3RUeXBlcyB9IGZyb20gJ2FudC1kZXNpZ24tdnVlL2VzL3NlbGVjdCc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IG9wdGlvbnMxID0gcmVmPFNlbGVjdFR5cGVzWydvcHRpb25zJ10+KFsKICAgICAgewogICAgICAgIHZhbHVlOiAnamFjaycsCiAgICAgICAgbGFiZWw6ICdKYWNrJywKICAgICAgfSwKICAgICAgewogICAgICAgIHZhbHVlOiAnbHVjeScsCiAgICAgICAgbGFiZWw6ICdMdWN5JywKICAgICAgfSwKICAgICAgewogICAgICAgIHZhbHVlOiAnZGlzYWJsZWQnLAogICAgICAgIGxhYmVsOiAnRGlzYWJsZWQnLAogICAgICAgIGRpc2FibGVkOiB0cnVlLAogICAgICB9LAogICAgICB7CiAgICAgICAgdmFsdWU6ICd5aW1pbmdoZScsCiAgICAgICAgbGFiZWw6ICdZaW1pbmdoZScsCiAgICAgIH0sCiAgICBdKTsKICAgIGNvbnN0IG9wdGlvbnMyID0gcmVmPFNlbGVjdFR5cGVzWydvcHRpb25zJ10+KFsKICAgICAgewogICAgICAgIHZhbHVlOiAnbHVjeScsCiAgICAgICAgbGFiZWw6ICdMdWN5JywKICAgICAgfSwKICAgIF0pOwogICAgY29uc3Qgb3B0aW9uczMgPSByZWY8U2VsZWN0VHlwZXNbJ29wdGlvbnMnXT4oWwogICAgICB7CiAgICAgICAgdmFsdWU6ICdsdWN5JywKICAgICAgICBsYWJlbDogJ0x1Y3knLAogICAgICB9LAogICAgXSk7CiAgICBjb25zdCBmb2N1cyA9ICgpID0+IHsKICAgICAgY29uc29sZS5sb2coJ2ZvY3VzJyk7CiAgICB9OwoKICAgIGNvbnN0IGhhbmRsZUNoYW5nZSA9ICh2YWx1ZTogc3RyaW5nKSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKGBzZWxlY3RlZCAke3ZhbHVlfWApOwogICAgfTsKCiAgICByZXR1cm4gewogICAgICBmb2N1cywKICAgICAgaGFuZGxlQ2hhbmdlLAogICAgICB2YWx1ZTE6IHJlZignbHVjeScpLAogICAgICB2YWx1ZTI6IHJlZignbHVjeScpLAogICAgICB2YWx1ZTM6IHJlZignbHVjeScpLAogICAgICBvcHRpb25zMSwKICAgICAgb3B0aW9uczIsCiAgICAgIG9wdGlvbnMzLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxoMj51c2UgYS1zZWxlY3Qtb3B0aW9uPC9oMj4KICA8YS1zcGFjZT4KICAgIDxhLXNlbGVjdAogICAgICByZWY9InNlbGVjdCIKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIgogICAgICBzdHlsZT0id2lkdGg6IDEyMHB4IgogICAgICBAZm9jdXM9ImZvY3VzIgogICAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgICA+CiAgICAgIDxhLXNlbGVjdC1vcHRpb24gdmFsdWU9ImphY2siPkphY2s8L2Etc2VsZWN0LW9wdGlvbj4KICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0ibHVjeSI+THVjeTwvYS1zZWxlY3Qtb3B0aW9uPgogICAgICA8YS1zZWxlY3Qtb3B0aW9uIHZhbHVlPSJkaXNhYmxlZCIgZGlzYWJsZWQ+RGlzYWJsZWQ8L2Etc2VsZWN0LW9wdGlvbj4KICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0iWWltaW5naGUiPnlpbWluZ2hlPC9hLXNlbGVjdC1vcHRpb24+CiAgICA8L2Etc2VsZWN0PgogICAgPGEtc2VsZWN0IHYtbW9kZWw6dmFsdWU9InZhbHVlMiIgc3R5bGU9IndpZHRoOiAxMjBweCIgZGlzYWJsZWQ+CiAgICAgIDxhLXNlbGVjdC1vcHRpb24gdmFsdWU9Imx1Y3kiPkx1Y3k8L2Etc2VsZWN0LW9wdGlvbj4KICAgIDwvYS1zZWxlY3Q+CiAgICA8YS1zZWxlY3Qgdi1tb2RlbDp2YWx1ZT0idmFsdWUzIiBzdHlsZT0id2lkdGg6IDEyMHB4IiBsb2FkaW5nPgogICAgICA8YS1zZWxlY3Qtb3B0aW9uIHZhbHVlPSJsdWN5Ij5MdWN5PC9hLXNlbGVjdC1vcHRpb24+CiAgICA8L2Etc2VsZWN0PgogIDwvYS1zcGFjZT4KICA8aDIgc3R5bGU9Im1hcmdpbi10b3A6IDEwcHgiPnVzZSBvcHRpb25zIChyZWNvbW1lbmQpPC9oMj4KICA8YS1zcGFjZT4KICAgIDxhLXNlbGVjdAogICAgICByZWY9InNlbGVjdCIKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIgogICAgICBzdHlsZT0id2lkdGg6IDEyMHB4IgogICAgICA6b3B0aW9ucz0ib3B0aW9uczEiCiAgICAgIEBmb2N1cz0iZm9jdXMiCiAgICAgIEBjaGFuZ2U9ImhhbmRsZUNoYW5nZSIKICAgID4KICAgIDwvYS1zZWxlY3Q+CiAgICA8YS1zZWxlY3Qgdi1tb2RlbDp2YWx1ZT0idmFsdWUyIiBzdHlsZT0id2lkdGg6IDEyMHB4IiBkaXNhYmxlZCA6b3B0aW9ucz0ib3B0aW9uczIiPjwvYS1zZWxlY3Q+CiAgICA8YS1zZWxlY3Qgdi1tb2RlbDp2YWx1ZT0idmFsdWUzIiBzdHlsZT0id2lkdGg6IDEyMHB4IiBsb2FkaW5nIDpvcHRpb25zPSJvcHRpb25zMyI+PC9hLXNlbGVjdD4KICA8L2Etc3BhY2U+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IG9wdGlvbnMxID0gcmVmKFsKICAgICAgewogICAgICAgIHZhbHVlOiAnamFjaycsCiAgICAgICAgbGFiZWw6ICdKYWNrJywKICAgICAgfSwKICAgICAgewogICAgICAgIHZhbHVlOiAnbHVjeScsCiAgICAgICAgbGFiZWw6ICdMdWN5JywKICAgICAgfSwKICAgICAgewogICAgICAgIHZhbHVlOiAnZGlzYWJsZWQnLAogICAgICAgIGxhYmVsOiAnRGlzYWJsZWQnLAogICAgICAgIGRpc2FibGVkOiB0cnVlLAogICAgICB9LAogICAgICB7CiAgICAgICAgdmFsdWU6ICd5aW1pbmdoZScsCiAgICAgICAgbGFiZWw6ICdZaW1pbmdoZScsCiAgICAgIH0sCiAgICBdKTsKICAgIGNvbnN0IG9wdGlvbnMyID0gcmVmKFsKICAgICAgewogICAgICAgIHZhbHVlOiAnbHVjeScsCiAgICAgICAgbGFiZWw6ICdMdWN5JywKICAgICAgfSwKICAgIF0pOwogICAgY29uc3Qgb3B0aW9uczMgPSByZWYoWwogICAgICB7CiAgICAgICAgdmFsdWU6ICdsdWN5JywKICAgICAgICBsYWJlbDogJ0x1Y3knLAogICAgICB9LAogICAgXSk7CiAgICBjb25zdCBmb2N1cyA9ICgpID0+IHsKICAgICAgY29uc29sZS5sb2coJ2ZvY3VzJyk7CiAgICB9OwogICAgY29uc3QgaGFuZGxlQ2hhbmdlID0gdmFsdWUgPT4gewogICAgICBjb25zb2xlLmxvZyhgc2VsZWN0ZWQgJHt2YWx1ZX1gKTsKICAgIH07CiAgICByZXR1cm4gewogICAgICBmb2N1cywKICAgICAgaGFuZGxlQ2hhbmdlLAogICAgICB2YWx1ZTE6IHJlZignbHVjeScpLAogICAgICB2YWx1ZTI6IHJlZignbHVjeScpLAogICAgICB2YWx1ZTM6IHJlZignbHVjeScpLAogICAgICBvcHRpb25zMSwKICAgICAgb3B0aW9uczIsCiAgICAgIG9wdGlvbnMzLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[a[12]||(a[12]=n("h2",null,"use a-select-option",-1)),e(k,null,{default:o(()=>[e(u,{ref:"select",value:s.value1,"onUpdate:value":a[0]||(a[0]=r=>s.value1=r),style:{width:"120px"},onFocus:s.focus,onChange:s.handleChange},{default:o(()=>[e(c,{value:"jack"},{default:o(()=>a[6]||(a[6]=[t("Jack")])),_:1,__:[6]}),e(c,{value:"lucy"},{default:o(()=>a[7]||(a[7]=[t("Lucy")])),_:1,__:[7]}),e(c,{value:"disabled",disabled:""},{default:o(()=>a[8]||(a[8]=[t("Disabled")])),_:1,__:[8]}),e(c,{value:"Yiminghe"},{default:o(()=>a[9]||(a[9]=[t("yiminghe")])),_:1,__:[9]})]),_:1},8,["value","onFocus","onChange"]),e(u,{value:s.value2,"onUpdate:value":a[1]||(a[1]=r=>s.value2=r),style:{width:"120px"},disabled:""},{default:o(()=>[e(c,{value:"lucy"},{default:o(()=>a[10]||(a[10]=[t("Lucy")])),_:1,__:[10]})]),_:1},8,["value"]),e(u,{value:s.value3,"onUpdate:value":a[2]||(a[2]=r=>s.value3=r),style:{width:"120px"},loading:""},{default:o(()=>[e(c,{value:"lucy"},{default:o(()=>a[11]||(a[11]=[t("Lucy")])),_:1,__:[11]})]),_:1},8,["value"])]),_:1}),a[13]||(a[13]=n("h2",{style:{"margin-top":"10px"}},"use options (recommend)",-1)),e(k,null,{default:o(()=>[e(u,{ref:"select",value:s.value1,"onUpdate:value":a[3]||(a[3]=r=>s.value1=r),style:{width:"120px"},options:s.options1,onFocus:s.focus,onChange:s.handleChange},null,8,["value","options","onFocus","onChange"]),e(u,{value:s.value2,"onUpdate:value":a[4]||(a[4]=r=>s.value2=r),style:{width:"120px"},disabled:"",options:s.options2},null,8,["value","options"]),e(u,{value:s.value3,"onUpdate:value":a[5]||(a[5]=r=>s.value3=r),style:{width:"120px"},loading:"",options:s.options3},null,8,["value","options"])]),_:1})]),htmlCode:o(()=>a[14]||(a[14]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("h2")]),n("span",{class:"token punctuation"},">")]),t("use a-select-option"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("h2")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},"ref"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"@focus"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("focus"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("jack"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Jack"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("lucy"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Lucy"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("disabled"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"disabled"),n("span",{class:"token punctuation"},">")]),t("Disabled"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Yiminghe"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yiminghe"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"disabled"),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("lucy"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Lucy"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value3"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"loading"),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("lucy"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Lucy"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("h2")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),t(" 10px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),t("use options (recommend)"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("h2")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},"ref"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@focus"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("focus"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"disabled"),t(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value3"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"loading"),t(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" SelectTypes "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue/es/select'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options1 "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("SelectTypes"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'options'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'disabled'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Disabled'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options2 "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("SelectTypes"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'options'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options3 "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("SelectTypes"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'options'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"focus"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'focus'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- focus`),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value1"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value2"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value3"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- options1`),n("span",{class:"token punctuation"},","),t(`
- options2`),n("span",{class:"token punctuation"},","),t(`
- options3`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[15]||(a[15]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("h2")]),n("span",{class:"token punctuation"},">")]),t("use a-select-option"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("h2")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},"ref"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"@focus"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("focus"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("jack"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Jack"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("lucy"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Lucy"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("disabled"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"disabled"),n("span",{class:"token punctuation"},">")]),t("Disabled"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Yiminghe"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yiminghe"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"disabled"),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("lucy"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Lucy"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value3"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"loading"),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("lucy"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Lucy"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("h2")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),t(" 10px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),t("use options (recommend)"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("h2")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},"ref"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@focus"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("focus"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"disabled"),t(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value3"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"loading"),t(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options1 "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'disabled'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Disabled'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options2 "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options3 "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"focus"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'focus'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"value"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- focus`),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value1"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value2"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value3"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- options1`),n("span",{class:"token punctuation"},","),t(`
- options2`),n("span",{class:"token punctuation"},","),t(`
- options3`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var on=A(an,[["render",sn]]);const en=h({setup(){return{popupScroll:()=>{console.log("popupScroll")},size:m("default"),value1:m("a1"),value2:m(["a1","b2"]),value3:m(["a1","b2"]),options:[...Array(25)].map((a,l)=>({value:(l+10).toString(36)+(l+1)}))}}});function pn(s,a,l,d,i,g){const c=p("a-radio-button"),u=p("a-radio-group"),k=p("a-select"),C=p("a-space"),r=p("demo-box");return b(),y(r,{jsfiddle:{us:"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.",cn:"\u4E09\u79CD\u5927\u5C0F\u7684\u9009\u62E9\u6846\uFF0C\u5F53 size \u5206\u522B\u4E3A `large` \u548C `small` \u65F6\uFF0C\u8F93\u5165\u6846\u9AD8\u5EA6\u4E3A `40px` \u548C `24px` \uFF0C\u9ED8\u8BA4\u9AD8\u5EA6\u4E3A `32px`\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u4E09\u79CD\u5927\u5C0F\u7684\u9009\u62E9\u6846\uFF0C\u5F53 size \u5206\u522B\u4E3A <code>large</code> \u548C <code>small</code> \u65F6\uFF0C\u8F93\u5165\u6846\u9AD8\u5EA6\u4E3A <code>40px</code> \u548C <code>24px</code> \uFF0C\u9ED8\u8BA4\u9AD8\u5EA6\u4E3A <code>32px</code>\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>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.</p>
- `,order:1,title:{"zh-CN":"\u4E09\u79CD\u5927\u5C0F","en-US":"Sizes"},relativePath:"src/docs/select/demo/size.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXJhZGlvLWdyb3VwIHYtbW9kZWw6dmFsdWU9InNpemUiPgogICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJsYXJnZSI+TGFyZ2U8L2EtcmFkaW8tYnV0dG9uPgogICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJkZWZhdWx0Ij5EZWZhdWx0PC9hLXJhZGlvLWJ1dHRvbj4KICAgIDxhLXJhZGlvLWJ1dHRvbiB2YWx1ZT0ic21hbGwiPlNtYWxsPC9hLXJhZGlvLWJ1dHRvbj4KICA8L2EtcmFkaW8tZ3JvdXA+CiAgPGJyIC8+CiAgPGJyIC8+CiAgPGEtc3BhY2UgZGlyZWN0aW9uPSJ2ZXJ0aWNhbCI+CiAgICA8YS1zZWxlY3QKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIgogICAgICA6c2l6ZT0ic2l6ZSIKICAgICAgc3R5bGU9IndpZHRoOiAyMDBweCIKICAgICAgOm9wdGlvbnM9Im9wdGlvbnMiCiAgICA+PC9hLXNlbGVjdD4KICAgIDxhLXNlbGVjdAogICAgICB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTIiCiAgICAgIDpvcHRpb25zPSJvcHRpb25zIgogICAgICBtb2RlPSJtdWx0aXBsZSIKICAgICAgOnNpemU9InNpemUiCiAgICAgIHBsYWNlaG9sZGVyPSJQbGVhc2Ugc2VsZWN0IgogICAgICBzdHlsZT0id2lkdGg6IDIwMHB4IgogICAgICBAcG9wdXBTY3JvbGw9InBvcHVwU2Nyb2xsIgogICAgPgogICAgPC9hLXNlbGVjdD4KICAgIDxhLXNlbGVjdAogICAgICB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTMiCiAgICAgIDpvcHRpb25zPSJvcHRpb25zIgogICAgICBtb2RlPSJ0YWdzIgogICAgICA6c2l6ZT0ic2l6ZSIKICAgICAgcGxhY2Vob2xkZXI9IlBsZWFzZSBzZWxlY3QiCiAgICAgIHN0eWxlPSJ3aWR0aDogMjAwcHgiCiAgICA+CiAgICA8L2Etc2VsZWN0PgogIDwvYS1zcGFjZT4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHBvcHVwU2Nyb2xsID0gKCkgPT4gewogICAgICBjb25zb2xlLmxvZygncG9wdXBTY3JvbGwnKTsKICAgIH07CgogICAgcmV0dXJuIHsKICAgICAgcG9wdXBTY3JvbGwsCiAgICAgIHNpemU6IHJlZignZGVmYXVsdCcpLAogICAgICB2YWx1ZTE6IHJlZignYTEnKSwKICAgICAgdmFsdWUyOiByZWYoWydhMScsICdiMiddKSwKICAgICAgdmFsdWUzOiByZWYoWydhMScsICdiMiddKSwKICAgICAgb3B0aW9uczogWy4uLkFycmF5KDI1KV0ubWFwKChfLCBpKSA9PiAoeyB2YWx1ZTogKGkgKyAxMCkudG9TdHJpbmcoMzYpICsgKGkgKyAxKSB9KSksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXJhZGlvLWdyb3VwIHYtbW9kZWw6dmFsdWU9InNpemUiPgogICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJsYXJnZSI+TGFyZ2U8L2EtcmFkaW8tYnV0dG9uPgogICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJkZWZhdWx0Ij5EZWZhdWx0PC9hLXJhZGlvLWJ1dHRvbj4KICAgIDxhLXJhZGlvLWJ1dHRvbiB2YWx1ZT0ic21hbGwiPlNtYWxsPC9hLXJhZGlvLWJ1dHRvbj4KICA8L2EtcmFkaW8tZ3JvdXA+CiAgPGJyIC8+CiAgPGJyIC8+CiAgPGEtc3BhY2UgZGlyZWN0aW9uPSJ2ZXJ0aWNhbCI+CiAgICA8YS1zZWxlY3QKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIgogICAgICA6c2l6ZT0ic2l6ZSIKICAgICAgc3R5bGU9IndpZHRoOiAyMDBweCIKICAgICAgOm9wdGlvbnM9Im9wdGlvbnMiCiAgICA+PC9hLXNlbGVjdD4KICAgIDxhLXNlbGVjdAogICAgICB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTIiCiAgICAgIDpvcHRpb25zPSJvcHRpb25zIgogICAgICBtb2RlPSJtdWx0aXBsZSIKICAgICAgOnNpemU9InNpemUiCiAgICAgIHBsYWNlaG9sZGVyPSJQbGVhc2Ugc2VsZWN0IgogICAgICBzdHlsZT0id2lkdGg6IDIwMHB4IgogICAgICBAcG9wdXBTY3JvbGw9InBvcHVwU2Nyb2xsIgogICAgPgogICAgPC9hLXNlbGVjdD4KICAgIDxhLXNlbGVjdAogICAgICB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTMiCiAgICAgIDpvcHRpb25zPSJvcHRpb25zIgogICAgICBtb2RlPSJ0YWdzIgogICAgICA6c2l6ZT0ic2l6ZSIKICAgICAgcGxhY2Vob2xkZXI9IlBsZWFzZSBzZWxlY3QiCiAgICAgIHN0eWxlPSJ3aWR0aDogMjAwcHgiCiAgICA+CiAgICA8L2Etc2VsZWN0PgogIDwvYS1zcGFjZT4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgcG9wdXBTY3JvbGwgPSAoKSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKCdwb3B1cFNjcm9sbCcpOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHBvcHVwU2Nyb2xsLAogICAgICBzaXplOiByZWYoJ2RlZmF1bHQnKSwKICAgICAgdmFsdWUxOiByZWYoJ2ExJyksCiAgICAgIHZhbHVlMjogcmVmKFsnYTEnLCAnYjInXSksCiAgICAgIHZhbHVlMzogcmVmKFsnYTEnLCAnYjInXSksCiAgICAgIG9wdGlvbnM6IFsuLi5BcnJheSgyNSldLm1hcCgoXywgaSkgPT4gKHsKICAgICAgICB2YWx1ZTogKGkgKyAxMCkudG9TdHJpbmcoMzYpICsgKGkgKyAxKSwKICAgICAgfSkpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[e(u,{value:s.size,"onUpdate:value":a[0]||(a[0]=I=>s.size=I)},{default:o(()=>[e(c,{value:"large"},{default:o(()=>a[4]||(a[4]=[t("Large")])),_:1,__:[4]}),e(c,{value:"default"},{default:o(()=>a[5]||(a[5]=[t("Default")])),_:1,__:[5]}),e(c,{value:"small"},{default:o(()=>a[6]||(a[6]=[t("Small")])),_:1,__:[6]})]),_:1},8,["value"]),a[7]||(a[7]=n("br",null,null,-1)),a[8]||(a[8]=n("br",null,null,-1)),e(C,{direction:"vertical"},{default:o(()=>[e(k,{value:s.value1,"onUpdate:value":a[1]||(a[1]=I=>s.value1=I),size:s.size,style:{width:"200px"},options:s.options},null,8,["value","size","options"]),e(k,{value:s.value2,"onUpdate:value":a[2]||(a[2]=I=>s.value2=I),options:s.options,mode:"multiple",size:s.size,placeholder:"Please select",style:{width:"200px"},onPopupScroll:s.popupScroll},null,8,["value","options","size","onPopupScroll"]),e(k,{value:s.value3,"onUpdate:value":a[3]||(a[3]=I=>s.value3=I),options:s.options,mode:"tags",size:s.size,placeholder:"Please select",style:{width:"200px"}},null,8,["value","options","size"])]),_:1})]),htmlCode:o(()=>a[9]||(a[9]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-radio-group")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("size"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-radio-button")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("large"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Large"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-radio-button")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-radio-button")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("default"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Default"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-radio-button")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-radio-button")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Small"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-radio-button")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-radio-group")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("br")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("br")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("size"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("size"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Please select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"@popupScroll"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("popupScroll"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value3"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("tags"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("size"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Please select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"popupScroll"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'popupScroll'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- popupScroll`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"size"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'default'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value1"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value2"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'b2'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value3"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'b2'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"options"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"Array"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"25"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"map"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("_"),n("span",{class:"token punctuation"},","),t(" i")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"10"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"36"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token punctuation"},"("),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[10]||(a[10]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-radio-group")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("size"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-radio-button")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("large"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Large"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-radio-button")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-radio-button")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("default"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Default"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-radio-button")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-radio-button")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Small"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-radio-button")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-radio-group")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("br")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("br")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("size"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("size"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Please select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"@popupScroll"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("popupScroll"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value3"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("tags"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("size"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Please select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"popupScroll"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'popupScroll'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- popupScroll`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"size"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'default'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value1"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value2"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'b2'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value3"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'b2'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"options"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"Array"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"25"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"map"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("_"),n("span",{class:"token punctuation"},","),t(" i")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"10"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"36"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token punctuation"},"("),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var cn=A(en,[["render",pn]]);const ln=h({setup(){const s=a=>{console.log(`selected ${a}`)};return{value:m([]),handleChange:s,options:[...Array(25)].map((a,l)=>({value:(l+10).toString(36)+(l+1)}))}}});function un(s,a,l,d,i,g){const c=p("a-select"),u=p("demo-box");return b(),y(u,{jsfiddle:{us:"Select with tags, transform input to tag (scroll the menu)",cn:"tags select\uFF0C\u968F\u610F\u8F93\u5165\u7684\u5185\u5BB9\uFF08scroll the menu\uFF09",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>tags select\uFF0C\u968F\u610F\u8F93\u5165\u7684\u5185\u5BB9\uFF08scroll the menu\uFF09</p>
- <h2 id="en-us">en-US</h2>
- <p>Select with tags, transform input to tag (scroll the menu)</p>
- `,order:2,title:{"zh-CN":"\u6807\u7B7E","en-US":"Tags"},relativePath:"src/docs/select/demo/tags.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBtb2RlPSJ0YWdzIgogICAgc3R5bGU9IndpZHRoOiAxMDAlIgogICAgcGxhY2Vob2xkZXI9IlRhZ3MgTW9kZSIKICAgIDpvcHRpb25zPSJvcHRpb25zIgogICAgQGNoYW5nZT0iaGFuZGxlQ2hhbmdlIgogID4KICA8L2Etc2VsZWN0Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgaGFuZGxlQ2hhbmdlID0gKHZhbHVlOiBzdHJpbmcpID0+IHsKICAgICAgY29uc29sZS5sb2coYHNlbGVjdGVkICR7dmFsdWV9YCk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgdmFsdWU6IHJlZihbXSksCiAgICAgIGhhbmRsZUNoYW5nZSwKICAgICAgb3B0aW9uczogWy4uLkFycmF5KDI1KV0ubWFwKChfLCBpKSA9PiAoeyB2YWx1ZTogKGkgKyAxMCkudG9TdHJpbmcoMzYpICsgKGkgKyAxKSB9KSksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBtb2RlPSJ0YWdzIgogICAgc3R5bGU9IndpZHRoOiAxMDAlIgogICAgcGxhY2Vob2xkZXI9IlRhZ3MgTW9kZSIKICAgIDpvcHRpb25zPSJvcHRpb25zIgogICAgQGNoYW5nZT0iaGFuZGxlQ2hhbmdlIgogID4KICA8L2Etc2VsZWN0Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBoYW5kbGVDaGFuZ2UgPSB2YWx1ZSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKGBzZWxlY3RlZCAke3ZhbHVlfWApOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlOiByZWYoW10pLAogICAgICBoYW5kbGVDaGFuZ2UsCiAgICAgIG9wdGlvbnM6IFsuLi5BcnJheSgyNSldLm1hcCgoXywgaSkgPT4gKHsKICAgICAgICB2YWx1ZTogKGkgKyAxMCkudG9TdHJpbmcoMzYpICsgKGkgKyAxKSwKICAgICAgfSkpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[e(c,{value:s.value,"onUpdate:value":a[0]||(a[0]=k=>s.value=k),mode:"tags",style:{width:"100%"},placeholder:"Tags Mode",options:s.options,onChange:s.handleChange},null,8,["value","options","onChange"])]),htmlCode:o(()=>a[1]||(a[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("tags"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Tags Mode"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"options"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"Array"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"25"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"map"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("_"),n("span",{class:"token punctuation"},","),t(" i")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"10"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"36"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token punctuation"},"("),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("tags"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Tags Mode"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"value"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"options"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"Array"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"25"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"map"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("_"),n("span",{class:"token punctuation"},","),t(" i")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"10"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"36"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token punctuation"},"("),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var kn=A(ln,[["render",un]]);const rn=h({setup(){const s=m([{value:"a1",label:"a1"}]),a=m([]),l=d=>{console.log(`selected ${d}`)};return S(a,()=>{console.log("value",a.value)}),{options:s,handleChange:l,value:a}}});function dn(s,a,l,d,i,g){const c=p("a-select"),u=p("demo-box");return b(),y(u,{jsfiddle:{us:"Try to copy `Lucy,Jack` to the input. Only available in tags and multiple mode.",cn:"\u8BD5\u4E0B\u590D\u5236 `\u9732\u897F,\u6770\u514B` \u5230\u8F93\u5165\u6846\u91CC\u3002\u53EA\u5728 tags \u548C multiple \u6A21\u5F0F\u4E0B\u53EF\u7528\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u8BD5\u4E0B\u590D\u5236 <code>\u9732\u897F,\u6770\u514B</code> \u5230\u8F93\u5165\u6846\u91CC\u3002\u53EA\u5728 tags \u548C multiple \u6A21\u5F0F\u4E0B\u53EF\u7528\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>Try to copy <code>Lucy,Jack</code> to the input. Only available in tags and multiple mode.</p>
- `,order:3,title:{"zh-CN":"\u81EA\u52A8\u5206\u8BCD","en-US":"Automatic tokenization"},relativePath:"src/docs/select/demo/automatic-tokenization.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBtb2RlPSJ0YWdzIgogICAgc3R5bGU9IndpZHRoOiAxMDAlIgogICAgOnRva2VuLXNlcGFyYXRvcnM9IlsnLCddIgogICAgcGxhY2Vob2xkZXI9IkF1dG9tYXRpYyB0b2tlbml6YXRpb24iCiAgICA6b3B0aW9ucz0ib3B0aW9ucyIKICAgIEBjaGFuZ2U9ImhhbmRsZUNoYW5nZSIKICA+PC9hLXNlbGVjdD4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmLCB3YXRjaCB9IGZyb20gJ3Z1ZSc7CmltcG9ydCB7IFNlbGVjdFR5cGVzIH0gZnJvbSAnYW50LWRlc2lnbi12dWUvZXMvc2VsZWN0JzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IG9wdGlvbnMgPSByZWY8U2VsZWN0VHlwZXNbJ29wdGlvbnMnXT4oWwogICAgICB7CiAgICAgICAgdmFsdWU6ICdhMScsCiAgICAgICAgbGFiZWw6ICdhMScsCiAgICAgIH0sCiAgICBdKTsKICAgIGNvbnN0IHZhbHVlID0gcmVmPHN0cmluZ1tdPihbXSk7CiAgICBjb25zdCBoYW5kbGVDaGFuZ2UgPSAodmFsdWU6IHN0cmluZykgPT4gewogICAgICBjb25zb2xlLmxvZyhgc2VsZWN0ZWQgJHt2YWx1ZX1gKTsKICAgIH07CiAgICB3YXRjaCh2YWx1ZSwgKCkgPT4gewogICAgICBjb25zb2xlLmxvZygndmFsdWUnLCB2YWx1ZS52YWx1ZSk7CiAgICB9KTsKICAgIHJldHVybiB7CiAgICAgIG9wdGlvbnMsCiAgICAgIGhhbmRsZUNoYW5nZSwKICAgICAgdmFsdWUsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBtb2RlPSJ0YWdzIgogICAgc3R5bGU9IndpZHRoOiAxMDAlIgogICAgOnRva2VuLXNlcGFyYXRvcnM9IlsnLCddIgogICAgcGxhY2Vob2xkZXI9IkF1dG9tYXRpYyB0b2tlbml6YXRpb24iCiAgICA6b3B0aW9ucz0ib3B0aW9ucyIKICAgIEBjaGFuZ2U9ImhhbmRsZUNoYW5nZSIKICA+PC9hLXNlbGVjdD4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYsIHdhdGNoIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IG9wdGlvbnMgPSByZWYoWwogICAgICB7CiAgICAgICAgdmFsdWU6ICdhMScsCiAgICAgICAgbGFiZWw6ICdhMScsCiAgICAgIH0sCiAgICBdKTsKICAgIGNvbnN0IHZhbHVlID0gcmVmKFtdKTsKICAgIGNvbnN0IGhhbmRsZUNoYW5nZSA9IHZhbHVlID0+IHsKICAgICAgY29uc29sZS5sb2coYHNlbGVjdGVkICR7dmFsdWV9YCk7CiAgICB9OwogICAgd2F0Y2godmFsdWUsICgpID0+IHsKICAgICAgY29uc29sZS5sb2coJ3ZhbHVlJywgdmFsdWUudmFsdWUpOwogICAgfSk7CiAgICByZXR1cm4gewogICAgICBvcHRpb25zLAogICAgICBoYW5kbGVDaGFuZ2UsCiAgICAgIHZhbHVlLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[e(c,{value:s.value,"onUpdate:value":a[0]||(a[0]=k=>s.value=k),mode:"tags",style:{width:"100%"},"token-separators":[","],placeholder:"Automatic tokenization",options:s.options,onChange:s.handleChange},null,8,["value","options","onChange"])]),htmlCode:o(()=>a[1]||(a[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("tags"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":token-separators"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("[',']"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Automatic tokenization"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref"),n("span",{class:"token punctuation"},","),t(" watch "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" SelectTypes "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue/es/select'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("SelectTypes"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'options'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'value'"),n("span",{class:"token punctuation"},","),t(" value"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- value`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("tags"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":token-separators"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("[',']"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Automatic tokenization"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref"),n("span",{class:"token punctuation"},","),t(" watch "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"value"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'value'"),n("span",{class:"token punctuation"},","),t(" value"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- value`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var gn=A(rn,[["render",dn]]);const Cn=h({setup(){const s=m([{value:"jack",label:"Jack (100)"},{value:"lucy",label:"Lucy (101)"}]),a=l=>{console.log(l)};return{value:m({value:"lucy"}),options:s,handleChange:a}}});function In(s,a,l,d,i,g){const c=p("a-select"),u=p("demo-box");return b(),y(u,{jsfiddle:{us:`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.
- The label of the selected item will be packed as an object for passing to the onChange callback.`,cn:"\u9ED8\u8BA4\u60C5\u51B5\u4E0B `onChange` \u91CC\u53EA\u80FD\u62FF\u5230 value\uFF0C\u5982\u679C\u9700\u8981\u62FF\u5230\u9009\u4E2D\u7684\u8282\u70B9\u6587\u672C label\uFF0C\u53EF\u4EE5\u4F7F\u7528 `labelInValue` \u5C5E\u6027\u3002\n\u9009\u4E2D\u9879\u7684 label \u4F1A\u88AB\u5305\u88C5\u5230 value \u4E2D\u4F20\u9012\u7ED9 `onChange` \u7B49\u51FD\u6570\uFF0C\u6B64\u65F6 value \u662F\u4E00\u4E2A\u5BF9\u8C61\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u9ED8\u8BA4\u60C5\u51B5\u4E0B <code>onChange</code> \u91CC\u53EA\u80FD\u62FF\u5230 value\uFF0C\u5982\u679C\u9700\u8981\u62FF\u5230\u9009\u4E2D\u7684\u8282\u70B9\u6587\u672C label\uFF0C\u53EF\u4EE5\u4F7F\u7528 <code>labelInValue</code> \u5C5E\u6027\u3002
- \u9009\u4E2D\u9879\u7684 label \u4F1A\u88AB\u5305\u88C5\u5230 value \u4E2D\u4F20\u9012\u7ED9 <code>onChange</code> \u7B49\u51FD\u6570\uFF0C\u6B64\u65F6 value \u662F\u4E00\u4E2A\u5BF9\u8C61\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>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.
- The label of the selected item will be packed as an object for passing to the onChange callback.</p>
- `,order:4,title:{"zh-CN":"\u83B7\u5F97\u9009\u9879\u7684\u6587\u672C","en-US":"Get value of selected item"},relativePath:"src/docs/select/demo/label-in-value.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBsYWJlbC1pbi12YWx1ZQogICAgc3R5bGU9IndpZHRoOiAxMjBweCIKICAgIDpvcHRpb25zPSJvcHRpb25zIgogICAgQGNoYW5nZT0iaGFuZGxlQ2hhbmdlIgogID4KICA8L2Etc2VsZWN0Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgU2VsZWN0VHlwZXMgfSBmcm9tICdhbnQtZGVzaWduLXZ1ZS9lcy9zZWxlY3QnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CgppbnRlcmZhY2UgVmFsdWUgewogIHZhbHVlPzogc3RyaW5nOwogIGxhYmVsPzogc3RyaW5nOwp9CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3Qgb3B0aW9ucyA9IHJlZjxTZWxlY3RUeXBlc1snb3B0aW9ucyddPihbCiAgICAgIHsKICAgICAgICB2YWx1ZTogJ2phY2snLAogICAgICAgIGxhYmVsOiAnSmFjayAoMTAwKScsCiAgICAgIH0sCiAgICAgIHsKICAgICAgICB2YWx1ZTogJ2x1Y3knLAogICAgICAgIGxhYmVsOiAnTHVjeSAoMTAxKScsCiAgICAgIH0sCiAgICBdKTsKICAgIGNvbnN0IGhhbmRsZUNoYW5nZSA9ICh2YWx1ZTogVmFsdWUpID0+IHsKICAgICAgY29uc29sZS5sb2codmFsdWUpOyAvLyB7IGtleTogImx1Y3kiLCBsYWJlbDogIkx1Y3kgKDEwMSkiIH0KICAgIH07CiAgICByZXR1cm4gewogICAgICB2YWx1ZTogcmVmPFZhbHVlPih7IHZhbHVlOiAnbHVjeScgfSksCiAgICAgIG9wdGlvbnMsCiAgICAgIGhhbmRsZUNoYW5nZSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBsYWJlbC1pbi12YWx1ZQogICAgc3R5bGU9IndpZHRoOiAxMjBweCIKICAgIDpvcHRpb25zPSJvcHRpb25zIgogICAgQGNoYW5nZT0iaGFuZGxlQ2hhbmdlIgogID4KICA8L2Etc2VsZWN0Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBvcHRpb25zID0gcmVmKFsKICAgICAgewogICAgICAgIHZhbHVlOiAnamFjaycsCiAgICAgICAgbGFiZWw6ICdKYWNrICgxMDApJywKICAgICAgfSwKICAgICAgewogICAgICAgIHZhbHVlOiAnbHVjeScsCiAgICAgICAgbGFiZWw6ICdMdWN5ICgxMDEpJywKICAgICAgfSwKICAgIF0pOwogICAgY29uc3QgaGFuZGxlQ2hhbmdlID0gdmFsdWUgPT4gewogICAgICBjb25zb2xlLmxvZyh2YWx1ZSk7IC8vIHsga2V5OiAibHVjeSIsIGxhYmVsOiAiTHVjeSAoMTAxKSIgfQogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlOiByZWYoewogICAgICAgIHZhbHVlOiAnbHVjeScsCiAgICAgIH0pLAogICAgICBvcHRpb25zLAogICAgICBoYW5kbGVDaGFuZ2UsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[e(c,{value:s.value,"onUpdate:value":a[0]||(a[0]=k=>s.value=k),"label-in-value":"",style:{width:"120px"},options:s.options,onChange:s.handleChange},null,8,["value","options","onChange"])]),htmlCode:o(()=>a[1]||(a[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"label-in-value"),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" SelectTypes "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue/es/select'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"interface"),t(),n("span",{class:"token class-name"},"Value"),t(),n("span",{class:"token punctuation"},"{"),t(`
- value`),n("span",{class:"token operator"},"?"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
- label`),n("span",{class:"token operator"},"?"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("SelectTypes"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'options'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Jack (100)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy (101)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" Value")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(),n("span",{class:"token comment"},'// { key: "lucy", label: "Lucy (101)" }'),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" ref"),n("span",{class:"token operator"},"<"),t("Value"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"label-in-value"),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Jack (100)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy (101)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"value"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(),n("span",{class:"token comment"},'// { key: "lucy", label: "Lucy (101)" }'),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var mn=A(Cn,[["render",In]]);const An=h({setup(){return{handleChange:a=>{console.log(`selected ${a}`)},value:m(["a1","b2"])}}});function bn(s,a,l,d,i,g){const c=p("a-select"),u=p("demo-box");return b(),y(u,{jsfiddle:{us:"Multiple selection, selecting from existing items (scroll the menu).",cn:"\u591A\u9009\uFF0C\u4ECE\u5DF2\u6709\u6761\u76EE\u4E2D\u9009\u62E9\uFF08scroll the menu\uFF09",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u591A\u9009\uFF0C\u4ECE\u5DF2\u6709\u6761\u76EE\u4E2D\u9009\u62E9\uFF08scroll the menu\uFF09</p>
- <h2 id="en-us">en-US</h2>
- <p>Multiple selection, selecting from existing items (scroll the menu).</p>
- `,order:5,title:{"zh-CN":"\u591A\u9009","en-US":"Multiple selection"},relativePath:"src/docs/select/demo/multiple.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBtb2RlPSJtdWx0aXBsZSIKICAgIHN0eWxlPSJ3aWR0aDogMTAwJSIKICAgIHBsYWNlaG9sZGVyPSJQbGVhc2Ugc2VsZWN0IgogICAgOm9wdGlvbnM9IlsuLi5BcnJheSgyNSldLm1hcCgoXywgaSkgPT4gKHsgdmFsdWU6IChpICsgMTApLnRvU3RyaW5nKDM2KSArIChpICsgMSkgfSkpIgogICAgQGNoYW5nZT0iaGFuZGxlQ2hhbmdlIgogID4KICA8L2Etc2VsZWN0Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgaGFuZGxlQ2hhbmdlID0gKHZhbHVlOiBzdHJpbmdbXSkgPT4gewogICAgICBjb25zb2xlLmxvZyhgc2VsZWN0ZWQgJHt2YWx1ZX1gKTsKICAgIH07CiAgICByZXR1cm4gewogICAgICBoYW5kbGVDaGFuZ2UsCiAgICAgIHZhbHVlOiByZWYoWydhMScsICdiMiddKSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBtb2RlPSJtdWx0aXBsZSIKICAgIHN0eWxlPSJ3aWR0aDogMTAwJSIKICAgIHBsYWNlaG9sZGVyPSJQbGVhc2Ugc2VsZWN0IgogICAgOm9wdGlvbnM9IlsuLi5BcnJheSgyNSldLm1hcCgoXywgaSkgPT4gKHsgdmFsdWU6IChpICsgMTApLnRvU3RyaW5nKDM2KSArIChpICsgMSkgfSkpIgogICAgQGNoYW5nZT0iaGFuZGxlQ2hhbmdlIgogID4KICA8L2Etc2VsZWN0Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBoYW5kbGVDaGFuZ2UgPSB2YWx1ZSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKGBzZWxlY3RlZCAke3ZhbHVlfWApOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIGhhbmRsZUNoYW5nZSwKICAgICAgdmFsdWU6IHJlZihbJ2ExJywgJ2IyJ10pLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[e(c,{value:s.value,"onUpdate:value":a[0]||(a[0]=k=>s.value=k),mode:"multiple",style:{width:"100%"},placeholder:"Please select",options:[...Array(25)].map((k,C)=>({value:(C+10).toString(36)+(C+1)})),onChange:s.handleChange},null,8,["value","options","onChange"])]),htmlCode:o(()=>a[1]||(a[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Please select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("[...Array(25)].map((_, i) => ({ value: (i + 10).toString(36) + (i + 1) }))"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'b2'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Please select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("[...Array(25)].map((_, i) => ({ value: (i + 10).toString(36) + (i + 1) }))"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"value"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'a1'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'b2'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var vn=A(An,[["render",bn]]);const J=["Zhejiang","Jiangsu"],x={Zhejiang:["Hangzhou","Ningbo","Wenzhou"],Jiangsu:["Nanjing","Suzhou","Zhenjiang"]},hn=h({setup(){const s=J[0],a=P({province:s,provinceData:J,cityData:x,secondCity:x[s][0]}),l=j(()=>x[a.province]);return S(()=>a.province,d=>{a.secondCity=a.cityData[d][0]}),{...L(a),cities:l}}});function yn(s,a,l,d,i,g){const c=p("a-select"),u=p("a-space"),k=p("demo-box");return b(),y(k,{jsfiddle:{us:`Coordinating the selection of provinces and cities is a common use case and demonstrates how selection can be coordinated.
- Using the [Cascader](/components/cascader) component is strongly recommended instead as it is more flexible and capable.`,cn:`\u7701\u5E02\u8054\u52A8\u662F\u5178\u578B\u7684\u4F8B\u5B50\u3002
- \u63A8\u8350\u4F7F\u7528 [Cascader](/components/cascader-cn/) \u7EC4\u4EF6\u3002`,docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u7701\u5E02\u8054\u52A8\u662F\u5178\u578B\u7684\u4F8B\u5B50\u3002
- \u63A8\u8350\u4F7F\u7528 <a href="/components/cascader-cn/">Cascader</a> \u7EC4\u4EF6\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>Coordinating the selection of provinces and cities is a common use case and demonstrates how selection can be coordinated.
- Using the <a href="/components/cascader.html">Cascader</a> component is strongly recommended instead as it is more flexible and capable.</p>
- `,order:6,title:{"zh-CN":"\u8054\u52A8","en-US":"Coordinate"},relativePath:"src/docs/select/demo/coordinate.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlPgogICAgPGEtc2VsZWN0CiAgICAgIHYtbW9kZWw6dmFsdWU9InByb3ZpbmNlIgogICAgICBzdHlsZT0id2lkdGg6IDEyMHB4IgogICAgICA6b3B0aW9ucz0icHJvdmluY2VEYXRhLm1hcChwcm8gPT4gKHsgdmFsdWU6IHBybyB9KSkiCiAgICA+CiAgICA8L2Etc2VsZWN0PgogICAgPGEtc2VsZWN0CiAgICAgIHYtbW9kZWw6dmFsdWU9InNlY29uZENpdHkiCiAgICAgIHN0eWxlPSJ3aWR0aDogMTIwcHgiCiAgICAgIDpvcHRpb25zPSJjaXRpZXMubWFwKGNpdHkgPT4gKHsgdmFsdWU6IGNpdHkgfSkpIgogICAgPgogICAgPC9hLXNlbGVjdD4KICA8L2Etc3BhY2U+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgpjb25zdCBwcm92aW5jZURhdGEgPSBbJ1poZWppYW5nJywgJ0ppYW5nc3UnXTsKY29uc3QgY2l0eURhdGEgPSB7CiAgWmhlamlhbmc6IFsnSGFuZ3pob3UnLCAnTmluZ2JvJywgJ1dlbnpob3UnXSwKICBKaWFuZ3N1OiBbJ05hbmppbmcnLCAnU3V6aG91JywgJ1poZW5qaWFuZyddLAp9OwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlYWN0aXZlLCB0b1JlZnMsIGNvbXB1dGVkLCB3YXRjaCB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBwcm92aW5jZSA9IHByb3ZpbmNlRGF0YVswXTsKICAgIGNvbnN0IHN0YXRlID0gcmVhY3RpdmUoewogICAgICBwcm92aW5jZSwKICAgICAgcHJvdmluY2VEYXRhLAogICAgICBjaXR5RGF0YSwKICAgICAgc2Vjb25kQ2l0eTogY2l0eURhdGFbcHJvdmluY2VdWzBdLAogICAgfSk7CiAgICBjb25zdCBjaXRpZXMgPSBjb21wdXRlZCgoKSA9PiB7CiAgICAgIHJldHVybiBjaXR5RGF0YVtzdGF0ZS5wcm92aW5jZV07CiAgICB9KTsKCiAgICB3YXRjaCgKICAgICAgKCkgPT4gc3RhdGUucHJvdmluY2UsCiAgICAgIHZhbCA9PiB7CiAgICAgICAgc3RhdGUuc2Vjb25kQ2l0eSA9IHN0YXRlLmNpdHlEYXRhW3ZhbF1bMF07CiAgICAgIH0sCiAgICApOwoKICAgIHJldHVybiB7CiAgICAgIC4uLnRvUmVmcyhzdGF0ZSksCiAgICAgIGNpdGllcywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlPgogICAgPGEtc2VsZWN0CiAgICAgIHYtbW9kZWw6dmFsdWU9InByb3ZpbmNlIgogICAgICBzdHlsZT0id2lkdGg6IDEyMHB4IgogICAgICA6b3B0aW9ucz0icHJvdmluY2VEYXRhLm1hcChwcm8gPT4gKHsgdmFsdWU6IHBybyB9KSkiCiAgICA+CiAgICA8L2Etc2VsZWN0PgogICAgPGEtc2VsZWN0CiAgICAgIHYtbW9kZWw6dmFsdWU9InNlY29uZENpdHkiCiAgICAgIHN0eWxlPSJ3aWR0aDogMTIwcHgiCiAgICAgIDpvcHRpb25zPSJjaXRpZXMubWFwKGNpdHkgPT4gKHsgdmFsdWU6IGNpdHkgfSkpIgogICAgPgogICAgPC9hLXNlbGVjdD4KICA8L2Etc3BhY2U+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmNvbnN0IHByb3ZpbmNlRGF0YSA9IFsnWmhlamlhbmcnLCAnSmlhbmdzdSddOwpjb25zdCBjaXR5RGF0YSA9IHsKICBaaGVqaWFuZzogWydIYW5nemhvdScsICdOaW5nYm8nLCAnV2VuemhvdSddLAogIEppYW5nc3U6IFsnTmFuamluZycsICdTdXpob3UnLCAnWmhlbmppYW5nJ10sCn07CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVhY3RpdmUsIHRvUmVmcywgY29tcHV0ZWQsIHdhdGNoIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHByb3ZpbmNlID0gcHJvdmluY2VEYXRhWzBdOwogICAgY29uc3Qgc3RhdGUgPSByZWFjdGl2ZSh7CiAgICAgIHByb3ZpbmNlLAogICAgICBwcm92aW5jZURhdGEsCiAgICAgIGNpdHlEYXRhLAogICAgICBzZWNvbmRDaXR5OiBjaXR5RGF0YVtwcm92aW5jZV1bMF0sCiAgICB9KTsKICAgIGNvbnN0IGNpdGllcyA9IGNvbXB1dGVkKCgpID0+IHsKICAgICAgcmV0dXJuIGNpdHlEYXRhW3N0YXRlLnByb3ZpbmNlXTsKICAgIH0pOwogICAgd2F0Y2goCiAgICAgICgpID0+IHN0YXRlLnByb3ZpbmNlLAogICAgICB2YWwgPT4gewogICAgICAgIHN0YXRlLnNlY29uZENpdHkgPSBzdGF0ZS5jaXR5RGF0YVt2YWxdWzBdOwogICAgICB9LAogICAgKTsKICAgIHJldHVybiB7CiAgICAgIC4uLnRvUmVmcyhzdGF0ZSksCiAgICAgIGNpdGllcywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[e(u,null,{default:o(()=>[e(c,{value:s.province,"onUpdate:value":a[0]||(a[0]=C=>s.province=C),style:{width:"120px"},options:s.provinceData.map(C=>({value:C}))},null,8,["value","options"]),e(c,{value:s.secondCity,"onUpdate:value":a[1]||(a[1]=C=>s.secondCity=C),style:{width:"120px"},options:s.cities.map(C=>({value:C}))},null,8,["value","options"])]),_:1})]),htmlCode:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("province"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("provinceData.map(pro => ({ value: pro }))"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("secondCity"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("cities.map(city => ({ value: city }))"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"const"),t(" provinceData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Zhejiang'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Jiangsu'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" cityData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"Zhejiang"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Hangzhou'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Ningbo'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Wenzhou'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"Jiangsu"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Nanjing'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Suzhou'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Zhenjiang'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" reactive"),n("span",{class:"token punctuation"},","),t(" toRefs"),n("span",{class:"token punctuation"},","),t(" computed"),n("span",{class:"token punctuation"},","),t(" watch "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" province "),n("span",{class:"token operator"},"="),t(" provinceData"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" state "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- province`),n("span",{class:"token punctuation"},","),t(`
- provinceData`),n("span",{class:"token punctuation"},","),t(`
- cityData`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"secondCity"),n("span",{class:"token operator"},":"),t(" cityData"),n("span",{class:"token punctuation"},"["),t("province"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" cities "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"return"),t(" cityData"),n("span",{class:"token punctuation"},"["),t("state"),n("span",{class:"token punctuation"},"."),t("province"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t(`
- `),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(" state"),n("span",{class:"token punctuation"},"."),t("province"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token parameter"},"val"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("secondCity "),n("span",{class:"token operator"},"="),t(" state"),n("span",{class:"token punctuation"},"."),t("cityData"),n("span",{class:"token punctuation"},"["),t("val"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"toRefs"),n("span",{class:"token punctuation"},"("),t("state"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- cities`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[3]||(a[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("province"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("provinceData.map(pro => ({ value: pro }))"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("secondCity"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("cities.map(city => ({ value: city }))"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"const"),t(" provinceData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Zhejiang'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Jiangsu'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" cityData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"Zhejiang"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Hangzhou'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Ningbo'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Wenzhou'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"Jiangsu"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Nanjing'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Suzhou'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Zhenjiang'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" reactive"),n("span",{class:"token punctuation"},","),t(" toRefs"),n("span",{class:"token punctuation"},","),t(" computed"),n("span",{class:"token punctuation"},","),t(" watch "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" province "),n("span",{class:"token operator"},"="),t(" provinceData"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" state "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- province`),n("span",{class:"token punctuation"},","),t(`
- provinceData`),n("span",{class:"token punctuation"},","),t(`
- cityData`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"secondCity"),n("span",{class:"token operator"},":"),t(" cityData"),n("span",{class:"token punctuation"},"["),t("province"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" cities "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"return"),t(" cityData"),n("span",{class:"token punctuation"},"["),t("state"),n("span",{class:"token punctuation"},"."),t("province"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t(`
- `),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(" state"),n("span",{class:"token punctuation"},"."),t("province"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token parameter"},"val"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("secondCity "),n("span",{class:"token operator"},"="),t(" state"),n("span",{class:"token punctuation"},"."),t("cityData"),n("span",{class:"token punctuation"},"["),t("val"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"toRefs"),n("span",{class:"token punctuation"},"("),t("state"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- cities`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var wn=A(hn,[["render",yn]]);const Zn=h({components:{UserOutlined:_},setup(){const s=l=>{console.log(`selected ${l}`)},a=m([{label:"Manager",options:[{value:"jack",label:"Jack"},{value:"lucy",label:"Lucy"}]},{label:"Engineer",options:[{value:"yiminghe",label:"Yiminghe"}]}]);return{value:m(["lucy"]),handleChange:s,options:a}}});function fn(s,a,l,d,i,g){const c=p("user-outlined"),u=p("a-select-option"),k=p("a-select-opt-group"),C=p("a-select"),r=p("a-space"),I=p("demo-box");return b(),y(I,{jsfiddle:{us:"Using `OptGroup` or `options.options` to group the options.",cn:"\u7528 `OptGroup` \u6216 `options.options` \u8FDB\u884C\u9009\u9879\u5206\u7EC4\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u7528 <code>OptGroup</code> \u6216 <code>options.options</code> \u8FDB\u884C\u9009\u9879\u5206\u7EC4\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>Using <code>OptGroup</code> or <code>options.options</code> to group the options.</p>
- `,order:7,title:{"zh-CN":"\u5206\u7EC4","en-US":"Option Group"},relativePath:"src/docs/select/demo/optgroup.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlPgogICAgPGEtc2VsZWN0IHYtbW9kZWw6dmFsdWU9InZhbHVlIiBzdHlsZT0id2lkdGg6IDIwMHB4IiBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiPgogICAgICA8YS1zZWxlY3Qtb3B0LWdyb3VwPgogICAgICAgIDx0ZW1wbGF0ZSAjbGFiZWw+CiAgICAgICAgICA8c3Bhbj4KICAgICAgICAgICAgPHVzZXItb3V0bGluZWQgLz4KICAgICAgICAgICAgTWFuYWdlcgogICAgICAgICAgPC9zcGFuPgogICAgICAgIDwvdGVtcGxhdGU+CiAgICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0iamFjayI+SmFjazwvYS1zZWxlY3Qtb3B0aW9uPgogICAgICAgIDxhLXNlbGVjdC1vcHRpb24gdmFsdWU9Imx1Y3kiPkx1Y3k8L2Etc2VsZWN0LW9wdGlvbj4KICAgICAgPC9hLXNlbGVjdC1vcHQtZ3JvdXA+CiAgICAgIDxhLXNlbGVjdC1vcHQtZ3JvdXAgbGFiZWw9IkVuZ2luZWVyIj4KICAgICAgICA8YS1zZWxlY3Qtb3B0aW9uIHZhbHVlPSJZaW1pbmdoZSI+eWltaW5naGU8L2Etc2VsZWN0LW9wdGlvbj4KICAgICAgICA8YS1zZWxlY3Qtb3B0aW9uIHZhbHVlPSJZaW1pbmdoZTEiPnlpbWluZ2hlMTwvYS1zZWxlY3Qtb3B0aW9uPgogICAgICA8L2Etc2VsZWN0LW9wdC1ncm91cD4KICAgIDwvYS1zZWxlY3Q+CiAgICA8YS1zZWxlY3QKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICAgIDpvcHRpb25zPSJvcHRpb25zIgogICAgICBzdHlsZT0id2lkdGg6IDIwMHB4IgogICAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgICA+PC9hLXNlbGVjdD4KICA8L2Etc3BhY2U+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmltcG9ydCB7IFVzZXJPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmltcG9ydCB7IFNlbGVjdFR5cGVzIH0gZnJvbSAnYW50LWRlc2lnbi12dWUvZXMvc2VsZWN0JzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBVc2VyT3V0bGluZWQsCiAgfSwKICBzZXR1cCgpIHsKICAgIGNvbnN0IGhhbmRsZUNoYW5nZSA9ICh2YWx1ZTogc3RyaW5nKSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKGBzZWxlY3RlZCAke3ZhbHVlfWApOwogICAgfTsKCiAgICBjb25zdCBvcHRpb25zID0gcmVmPFNlbGVjdFR5cGVzWydvcHRpb25zJ10+KFsKICAgICAgewogICAgICAgIGxhYmVsOiAnTWFuYWdlcicsCiAgICAgICAgb3B0aW9uczogWwogICAgICAgICAgewogICAgICAgICAgICB2YWx1ZTogJ2phY2snLAogICAgICAgICAgICBsYWJlbDogJ0phY2snLAogICAgICAgICAgfSwKICAgICAgICAgIHsKICAgICAgICAgICAgdmFsdWU6ICdsdWN5JywKICAgICAgICAgICAgbGFiZWw6ICdMdWN5JywKICAgICAgICAgIH0sCiAgICAgICAgXSwKICAgICAgfSwKICAgICAgewogICAgICAgIGxhYmVsOiAnRW5naW5lZXInLAogICAgICAgIG9wdGlvbnM6IFsKICAgICAgICAgIHsKICAgICAgICAgICAgdmFsdWU6ICd5aW1pbmdoZScsCiAgICAgICAgICAgIGxhYmVsOiAnWWltaW5naGUnLAogICAgICAgICAgfSwKICAgICAgICBdLAogICAgICB9LAogICAgXSk7CgogICAgcmV0dXJuIHsKICAgICAgdmFsdWU6IHJlZihbJ2x1Y3knXSksCiAgICAgIGhhbmRsZUNoYW5nZSwKICAgICAgb3B0aW9ucywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlPgogICAgPGEtc2VsZWN0IHYtbW9kZWw6dmFsdWU9InZhbHVlIiBzdHlsZT0id2lkdGg6IDIwMHB4IiBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiPgogICAgICA8YS1zZWxlY3Qtb3B0LWdyb3VwPgogICAgICAgIDx0ZW1wbGF0ZSAjbGFiZWw+CiAgICAgICAgICA8c3Bhbj4KICAgICAgICAgICAgPHVzZXItb3V0bGluZWQgLz4KICAgICAgICAgICAgTWFuYWdlcgogICAgICAgICAgPC9zcGFuPgogICAgICAgIDwvdGVtcGxhdGU+CiAgICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0iamFjayI+SmFjazwvYS1zZWxlY3Qtb3B0aW9uPgogICAgICAgIDxhLXNlbGVjdC1vcHRpb24gdmFsdWU9Imx1Y3kiPkx1Y3k8L2Etc2VsZWN0LW9wdGlvbj4KICAgICAgPC9hLXNlbGVjdC1vcHQtZ3JvdXA+CiAgICAgIDxhLXNlbGVjdC1vcHQtZ3JvdXAgbGFiZWw9IkVuZ2luZWVyIj4KICAgICAgICA8YS1zZWxlY3Qtb3B0aW9uIHZhbHVlPSJZaW1pbmdoZSI+eWltaW5naGU8L2Etc2VsZWN0LW9wdGlvbj4KICAgICAgICA8YS1zZWxlY3Qtb3B0aW9uIHZhbHVlPSJZaW1pbmdoZTEiPnlpbWluZ2hlMTwvYS1zZWxlY3Qtb3B0aW9uPgogICAgICA8L2Etc2VsZWN0LW9wdC1ncm91cD4KICAgIDwvYS1zZWxlY3Q+CiAgICA8YS1zZWxlY3QKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICAgIDpvcHRpb25zPSJvcHRpb25zIgogICAgICBzdHlsZT0id2lkdGg6IDIwMHB4IgogICAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgICA+PC9hLXNlbGVjdD4KICA8L2Etc3BhY2U+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKaW1wb3J0IHsgVXNlck91dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBVc2VyT3V0bGluZWQsCiAgfSwKICBzZXR1cCgpIHsKICAgIGNvbnN0IGhhbmRsZUNoYW5nZSA9IHZhbHVlID0+IHsKICAgICAgY29uc29sZS5sb2coYHNlbGVjdGVkICR7dmFsdWV9YCk7CiAgICB9OwogICAgY29uc3Qgb3B0aW9ucyA9IHJlZihbCiAgICAgIHsKICAgICAgICBsYWJlbDogJ01hbmFnZXInLAogICAgICAgIG9wdGlvbnM6IFsKICAgICAgICAgIHsKICAgICAgICAgICAgdmFsdWU6ICdqYWNrJywKICAgICAgICAgICAgbGFiZWw6ICdKYWNrJywKICAgICAgICAgIH0sCiAgICAgICAgICB7CiAgICAgICAgICAgIHZhbHVlOiAnbHVjeScsCiAgICAgICAgICAgIGxhYmVsOiAnTHVjeScsCiAgICAgICAgICB9LAogICAgICAgIF0sCiAgICAgIH0sCiAgICAgIHsKICAgICAgICBsYWJlbDogJ0VuZ2luZWVyJywKICAgICAgICBvcHRpb25zOiBbCiAgICAgICAgICB7CiAgICAgICAgICAgIHZhbHVlOiAneWltaW5naGUnLAogICAgICAgICAgICBsYWJlbDogJ1lpbWluZ2hlJywKICAgICAgICAgIH0sCiAgICAgICAgXSwKICAgICAgfSwKICAgIF0pOwogICAgcmV0dXJuIHsKICAgICAgdmFsdWU6IHJlZihbJ2x1Y3knXSksCiAgICAgIGhhbmRsZUNoYW5nZSwKICAgICAgb3B0aW9ucywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[e(r,null,{default:o(()=>[e(C,{value:s.value,"onUpdate:value":a[0]||(a[0]=v=>s.value=v),style:{width:"200px"},onChange:s.handleChange},{default:o(()=>[e(k,null,{label:o(()=>[n("span",null,[e(c),a[2]||(a[2]=t(" Manager "))])]),default:o(()=>[e(u,{value:"jack"},{default:o(()=>a[3]||(a[3]=[t("Jack")])),_:1,__:[3]}),e(u,{value:"lucy"},{default:o(()=>a[4]||(a[4]=[t("Lucy")])),_:1,__:[4]})]),_:1}),e(k,{label:"Engineer"},{default:o(()=>[e(u,{value:"Yiminghe"},{default:o(()=>a[5]||(a[5]=[t("yiminghe")])),_:1,__:[5]}),e(u,{value:"Yiminghe1"},{default:o(()=>a[6]||(a[6]=[t("yiminghe1")])),_:1,__:[6]})]),_:1})]),_:1},8,["value","onChange"]),e(C,{value:s.value,"onUpdate:value":a[1]||(a[1]=v=>s.value=v),options:s.options,style:{width:"200px"},onChange:s.handleChange},null,8,["value","options","onChange"])]),_:1})]),htmlCode:o(()=>a[7]||(a[7]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-opt-group")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#label"),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("user-outlined")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- Manager
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("jack"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Jack"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("lucy"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Lucy"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-opt-group")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-opt-group")]),t(),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Engineer"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Yiminghe"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yiminghe"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Yiminghe1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yiminghe1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-opt-group")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" UserOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" SelectTypes "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue/es/select'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
- UserOutlined`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("SelectTypes"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'options'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Manager'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"options"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Engineer'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"options"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[8]||(a[8]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-opt-group")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#label"),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("user-outlined")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- Manager
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("jack"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Jack"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("lucy"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Lucy"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-opt-group")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-opt-group")]),t(),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Engineer"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Yiminghe"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yiminghe"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Yiminghe1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yiminghe1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-opt-group")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" UserOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
- UserOutlined`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"value"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Manager'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"options"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Engineer'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"options"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var Wn=A(Zn,[["render",fn]]),R={exports:{}};(function(s,a){(function(l,d){d(a,s)})(E,function(l,d){var i={timeout:5e3,jsonpCallback:"callback",jsonpCallbackFunction:null};function g(){return"jsonp_"+Date.now()+"_"+Math.ceil(Math.random()*1e5)}function c(C){try{delete window[C]}catch{window[C]=void 0}}function u(C){var r=document.getElementById(C);r&&document.getElementsByTagName("head")[0].removeChild(r)}function k(C){var r=arguments.length<=1||arguments[1]===void 0?{}:arguments[1],I=C,v=r.timeout||i.timeout,w=r.jsonpCallback||i.jsonpCallback,Z=void 0;return new Promise(function(N,Y){var f=r.jsonpCallbackFunction||g(),G=w+"_"+f;window[f]=function(F){N({ok:!0,json:function(){return Promise.resolve(F)}}),Z&&clearTimeout(Z),u(G),c(f)},I+=I.indexOf("?")===-1?"?":"&";var W=document.createElement("script");W.setAttribute("src",""+I+w+"="+f),r.charset&&W.setAttribute("charset",r.charset),r.nonce&&W.setAttribute("nonce",r.nonce),r.referrerPolicy&&W.setAttribute("referrerPolicy",r.referrerPolicy),r.crossorigin&&W.setAttribute("crossorigin","true"),W.id=G,document.getElementsByTagName("head")[0].appendChild(W),Z=setTimeout(function(){Y(new Error("JSONP request to "+C+" timed out")),c(f),u(G),window[f]=function(){c(f)}},v),W.onerror=function(){Y(new Error("JSONP request to "+C+" failed")),c(f),u(G),Z&&clearTimeout(Z)}})}d.exports=k})})(R,R.exports);var Gn=R.exports,V={};function Bn(s,a){return Object.prototype.hasOwnProperty.call(s,a)}var Vn=function(s,a,l,d){a=a||"&",l=l||"=";var i={};if(typeof s!="string"||s.length===0)return i;var g=/\+/g;s=s.split(a);var c=1e3;d&&typeof d.maxKeys=="number"&&(c=d.maxKeys);var u=s.length;c>0&&u>c&&(u=c);for(var k=0;k<u;++k){var C=s[k].replace(g,"%20"),r=C.indexOf(l),I,v,w,Z;r>=0?(I=C.substr(0,r),v=C.substr(r+1)):(I=C,v=""),w=decodeURIComponent(I),Z=decodeURIComponent(v),Bn(i,w)?Array.isArray(i[w])?i[w].push(Z):i[w]=[i[w],Z]:i[w]=Z}return i},B=function(s){switch(typeof s){case"string":return s;case"boolean":return s?"true":"false";case"number":return isFinite(s)?s:"";default:return""}},Yn=function(s,a,l,d){return a=a||"&",l=l||"=",s===null&&(s=void 0),typeof s=="object"?Object.keys(s).map(function(i){var g=encodeURIComponent(B(i))+l;return Array.isArray(s[i])?s[i].map(function(c){return g+encodeURIComponent(B(c))}).join(a):g+encodeURIComponent(B(s[i]))}).filter(Boolean).join(a):d?encodeURIComponent(B(d))+l+encodeURIComponent(B(s)):""};V.decode=V.parse=Vn;V.encode=V.stringify=Yn;let H,D="";function z(s,a){H&&(clearTimeout(H),H=null),D=s;function l(){const d=V.encode({code:"utf-8",q:s});Gn(`https://suggest.taobao.com/sug?${d}`).then(i=>i.json()).then(i=>{if(D===s){const g=i.result,c=[];g.forEach(u=>{c.push({value:u[0],label:u[0]})}),a(c)}})}H=setTimeout(l,300)}const Hn=h({setup(){const s=m([]),a=m();return{handleSearch:i=>{z(i,g=>s.value=g)},handleChange:i=>{console.log(i),a.value=i,z(i,g=>s.value=g)},data:s,value:a}}});function Sn(s,a,l,d,i,g){const c=p("a-select"),u=p("demo-box");return b(),y(u,{jsfiddle:{us:"Search with remote data.",cn:"\u641C\u7D22\u548C\u8FDC\u7A0B\u6570\u636E\u7ED3\u5408\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u641C\u7D22\u548C\u8FDC\u7A0B\u6570\u636E\u7ED3\u5408\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>Search with remote data.</p>
- `,order:8,title:{"zh-CN":"\u641C\u7D22\u6846","en-US":"Search Box"},relativePath:"src/docs/select/demo/search-box.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBzaG93LXNlYXJjaAogICAgcGxhY2Vob2xkZXI9ImlucHV0IHNlYXJjaCB0ZXh0IgogICAgc3R5bGU9IndpZHRoOiAyMDBweCIKICAgIDpkZWZhdWx0LWFjdGl2ZS1maXJzdC1vcHRpb249ImZhbHNlIgogICAgOnNob3ctYXJyb3c9ImZhbHNlIgogICAgOmZpbHRlci1vcHRpb249ImZhbHNlIgogICAgOm5vdC1mb3VuZC1jb250ZW50PSJudWxsIgogICAgOm9wdGlvbnM9ImRhdGEiCiAgICBAc2VhcmNoPSJoYW5kbGVTZWFyY2giCiAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgPgogIDwvYS1zZWxlY3Q+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQganNvbnAgZnJvbSAnZmV0Y2gtanNvbnAnOwppbXBvcnQgcXVlcnlzdHJpbmcgZnJvbSAncXVlcnlzdHJpbmcnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CgpsZXQgdGltZW91dDogYW55OwpsZXQgY3VycmVudFZhbHVlID0gJyc7CgpmdW5jdGlvbiBmZXRjaCh2YWx1ZTogc3RyaW5nLCBjYWxsYmFjazogYW55KSB7CiAgaWYgKHRpbWVvdXQpIHsKICAgIGNsZWFyVGltZW91dCh0aW1lb3V0KTsKICAgIHRpbWVvdXQgPSBudWxsOwogIH0KICBjdXJyZW50VmFsdWUgPSB2YWx1ZTsKCiAgZnVuY3Rpb24gZmFrZSgpIHsKICAgIGNvbnN0IHN0ciA9IHF1ZXJ5c3RyaW5nLmVuY29kZSh7CiAgICAgIGNvZGU6ICd1dGYtOCcsCiAgICAgIHE6IHZhbHVlLAogICAgfSk7CiAgICBqc29ucChgaHR0cHM6Ly9zdWdnZXN0LnRhb2Jhby5jb20vc3VnPyR7c3RyfWApCiAgICAgIC50aGVuKHJlc3BvbnNlID0+IHJlc3BvbnNlLmpzb24oKSkKICAgICAgLnRoZW4oZCA9PiB7CiAgICAgICAgaWYgKGN1cnJlbnRWYWx1ZSA9PT0gdmFsdWUpIHsKICAgICAgICAgIGNvbnN0IHJlc3VsdCA9IGQucmVzdWx0OwogICAgICAgICAgY29uc3QgZGF0YTogYW55W10gPSBbXTsKICAgICAgICAgIHJlc3VsdC5mb3JFYWNoKChyOiBhbnkpID0+IHsKICAgICAgICAgICAgZGF0YS5wdXNoKHsKICAgICAgICAgICAgICB2YWx1ZTogclswXSwKICAgICAgICAgICAgICBsYWJlbDogclswXSwKICAgICAgICAgICAgfSk7CiAgICAgICAgICB9KTsKICAgICAgICAgIGNhbGxiYWNrKGRhdGEpOwogICAgICAgIH0KICAgICAgfSk7CiAgfQoKICB0aW1lb3V0ID0gc2V0VGltZW91dChmYWtlLCAzMDApOwp9CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgZGF0YSA9IHJlZjxhbnlbXT4oW10pOwogICAgY29uc3QgdmFsdWUgPSByZWYoKTsKCiAgICBjb25zdCBoYW5kbGVTZWFyY2ggPSAodmFsOiBzdHJpbmcpID0+IHsKICAgICAgZmV0Y2godmFsLCAoZDogYW55W10pID0+IChkYXRhLnZhbHVlID0gZCkpOwogICAgfTsKICAgIGNvbnN0IGhhbmRsZUNoYW5nZSA9ICh2YWw6IHN0cmluZykgPT4gewogICAgICBjb25zb2xlLmxvZyh2YWwpOwogICAgICB2YWx1ZS52YWx1ZSA9IHZhbDsKICAgICAgZmV0Y2godmFsLCAoZDogYW55W10pID0+IChkYXRhLnZhbHVlID0gZCkpOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIGhhbmRsZVNlYXJjaCwKICAgICAgaGFuZGxlQ2hhbmdlLAogICAgICBkYXRhLAogICAgICB2YWx1ZSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBzaG93LXNlYXJjaAogICAgcGxhY2Vob2xkZXI9ImlucHV0IHNlYXJjaCB0ZXh0IgogICAgc3R5bGU9IndpZHRoOiAyMDBweCIKICAgIDpkZWZhdWx0LWFjdGl2ZS1maXJzdC1vcHRpb249ImZhbHNlIgogICAgOnNob3ctYXJyb3c9ImZhbHNlIgogICAgOmZpbHRlci1vcHRpb249ImZhbHNlIgogICAgOm5vdC1mb3VuZC1jb250ZW50PSJudWxsIgogICAgOm9wdGlvbnM9ImRhdGEiCiAgICBAc2VhcmNoPSJoYW5kbGVTZWFyY2giCiAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgPgogIDwvYS1zZWxlY3Q+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCBqc29ucCBmcm9tICdmZXRjaC1qc29ucCc7CmltcG9ydCBxdWVyeXN0cmluZyBmcm9tICdxdWVyeXN0cmluZyc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKbGV0IHRpbWVvdXQ7CmxldCBjdXJyZW50VmFsdWUgPSAnJzsKZnVuY3Rpb24gZmV0Y2godmFsdWUsIGNhbGxiYWNrKSB7CiAgaWYgKHRpbWVvdXQpIHsKICAgIGNsZWFyVGltZW91dCh0aW1lb3V0KTsKICAgIHRpbWVvdXQgPSBudWxsOwogIH0KICBjdXJyZW50VmFsdWUgPSB2YWx1ZTsKICBmdW5jdGlvbiBmYWtlKCkgewogICAgY29uc3Qgc3RyID0gcXVlcnlzdHJpbmcuZW5jb2RlKHsKICAgICAgY29kZTogJ3V0Zi04JywKICAgICAgcTogdmFsdWUsCiAgICB9KTsKICAgIGpzb25wKGBodHRwczovL3N1Z2dlc3QudGFvYmFvLmNvbS9zdWc/JHtzdHJ9YCkKICAgICAgLnRoZW4ocmVzcG9uc2UgPT4gcmVzcG9uc2UuanNvbigpKQogICAgICAudGhlbihkID0+IHsKICAgICAgICBpZiAoY3VycmVudFZhbHVlID09PSB2YWx1ZSkgewogICAgICAgICAgY29uc3QgcmVzdWx0ID0gZC5yZXN1bHQ7CiAgICAgICAgICBjb25zdCBkYXRhID0gW107CiAgICAgICAgICByZXN1bHQuZm9yRWFjaChyID0+IHsKICAgICAgICAgICAgZGF0YS5wdXNoKHsKICAgICAgICAgICAgICB2YWx1ZTogclswXSwKICAgICAgICAgICAgICBsYWJlbDogclswXSwKICAgICAgICAgICAgfSk7CiAgICAgICAgICB9KTsKICAgICAgICAgIGNhbGxiYWNrKGRhdGEpOwogICAgICAgIH0KICAgICAgfSk7CiAgfQogIHRpbWVvdXQgPSBzZXRUaW1lb3V0KGZha2UsIDMwMCk7Cn0KZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IGRhdGEgPSByZWYoW10pOwogICAgY29uc3QgdmFsdWUgPSByZWYoKTsKICAgIGNvbnN0IGhhbmRsZVNlYXJjaCA9IHZhbCA9PiB7CiAgICAgIGZldGNoKHZhbCwgZCA9PiAoZGF0YS52YWx1ZSA9IGQpKTsKICAgIH07CiAgICBjb25zdCBoYW5kbGVDaGFuZ2UgPSB2YWwgPT4gewogICAgICBjb25zb2xlLmxvZyh2YWwpOwogICAgICB2YWx1ZS52YWx1ZSA9IHZhbDsKICAgICAgZmV0Y2godmFsLCBkID0+IChkYXRhLnZhbHVlID0gZCkpOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIGhhbmRsZVNlYXJjaCwKICAgICAgaGFuZGxlQ2hhbmdlLAogICAgICBkYXRhLAogICAgICB2YWx1ZSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[e(c,{value:s.value,"onUpdate:value":a[0]||(a[0]=k=>s.value=k),"show-search":"",placeholder:"input search text",style:{width:"200px"},"default-active-first-option":!1,"show-arrow":!1,"filter-option":!1,"not-found-content":null,options:s.data,onSearch:s.handleSearch,onChange:s.handleChange},null,8,["value","options","onSearch","onChange"])]),htmlCode:o(()=>a[1]||(a[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"show-search"),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("input search text"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":default-active-first-option"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":show-arrow"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":filter-option"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":not-found-content"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("null"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("data"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@search"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleSearch"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(" jsonp "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'fetch-jsonp'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(" querystring "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'querystring'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"let"),t(),n("span",{class:"token literal-property property"},"timeout"),n("span",{class:"token operator"},":"),t(" any"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"let"),t(" currentValue "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"function"),t(),n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"callback"),n("span",{class:"token operator"},":"),t(" any")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("timeout"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"clearTimeout"),n("span",{class:"token punctuation"},"("),t("timeout"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- timeout `),n("span",{class:"token operator"},"="),t(),n("span",{class:"token keyword"},"null"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- currentValue `),n("span",{class:"token operator"},"="),t(" value"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"function"),t(),n("span",{class:"token function"},"fake"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" str "),n("span",{class:"token operator"},"="),t(" querystring"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"encode"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"code"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'utf-8'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"q"),n("span",{class:"token operator"},":"),t(" value"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"jsonp"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"https://suggest.taobao.com/sug?"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("str"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),t(`
- `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"response"),t(),n("span",{class:"token operator"},"=>"),t(" response"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"json"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),t(`
- `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"d"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("currentValue "),n("span",{class:"token operator"},"==="),t(" value"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" result "),n("span",{class:"token operator"},"="),t(" d"),n("span",{class:"token punctuation"},"."),t("result"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token literal-property property"},"data"),n("span",{class:"token operator"},":"),t(" any"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- result`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"r"),n("span",{class:"token operator"},":"),t(" any")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- data`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" r"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(" r"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"callback"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- timeout `),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),t("fake"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"300"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" data "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("any"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleSearch"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"val"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),t("val"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"d"),n("span",{class:"token operator"},":"),t(" any"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" d"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"val"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- value`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" val"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),t("val"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"d"),n("span",{class:"token operator"},":"),t(" any"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" d"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- handleSearch`),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- data`),n("span",{class:"token punctuation"},","),t(`
- value`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"show-search"),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("input search text"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":default-active-first-option"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":show-arrow"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":filter-option"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":not-found-content"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("null"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("data"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@search"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleSearch"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(" jsonp "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'fetch-jsonp'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(" querystring "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'querystring'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"let"),t(" timeout"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"let"),t(" currentValue "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"function"),t(),n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("value"),n("span",{class:"token punctuation"},","),t(" callback")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("timeout"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"clearTimeout"),n("span",{class:"token punctuation"},"("),t("timeout"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- timeout `),n("span",{class:"token operator"},"="),t(),n("span",{class:"token keyword"},"null"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- currentValue `),n("span",{class:"token operator"},"="),t(" value"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"function"),t(),n("span",{class:"token function"},"fake"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" str "),n("span",{class:"token operator"},"="),t(" querystring"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"encode"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"code"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'utf-8'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"q"),n("span",{class:"token operator"},":"),t(" value"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"jsonp"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"https://suggest.taobao.com/sug?"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("str"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),t(`
- `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"response"),t(),n("span",{class:"token operator"},"=>"),t(" response"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"json"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),t(`
- `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"d"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("currentValue "),n("span",{class:"token operator"},"==="),t(" value"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" result "),n("span",{class:"token operator"},"="),t(" d"),n("span",{class:"token punctuation"},"."),t("result"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- result`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"r"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- data`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" r"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(" r"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"callback"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- timeout `),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"setTimeout"),n("span",{class:"token punctuation"},"("),t("fake"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"300"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleSearch"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"val"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),t("val"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token parameter"},"d"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" d"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"val"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- value`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" val"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),t("val"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token parameter"},"d"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" d"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- handleSearch`),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- data`),n("span",{class:"token punctuation"},","),t(`
- value`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var Nn=A(Hn,[["render",Sn]]);const Fn=h({setup(){const s=m([{value:"jack",label:"Jack"},{value:"lucy",label:"Lucy"},{value:"tom",label:"Tom"}]),a=g=>{console.log(`selected ${g}`)},l=()=>{console.log("blur")},d=()=>{console.log("focus")},i=(g,c)=>c.value.toLowerCase().indexOf(g.toLowerCase())>=0;return{value:m(void 0),filterOption:i,handleBlur:l,handleFocus:d,handleChange:a,options:s}}});function xn(s,a,l,d,i,g){const c=p("a-select"),u=p("demo-box");return b(),y(u,{jsfiddle:{us:"Search the options while expanded.",cn:"\u5C55\u5F00\u540E\u53EF\u5BF9\u9009\u9879\u8FDB\u884C\u641C\u7D22\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u5C55\u5F00\u540E\u53EF\u5BF9\u9009\u9879\u8FDB\u884C\u641C\u7D22\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>Search the options while expanded.</p>
- `,order:9,title:{"zh-CN":"\u5E26\u641C\u7D22\u6846","en-US":"Select with search field"},relativePath:"src/docs/select/demo/search.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBzaG93LXNlYXJjaAogICAgcGxhY2Vob2xkZXI9IlNlbGVjdCBhIHBlcnNvbiIKICAgIHN0eWxlPSJ3aWR0aDogMjAwcHgiCiAgICA6b3B0aW9ucz0ib3B0aW9ucyIKICAgIEBmb2N1cz0iaGFuZGxlRm9jdXMiCiAgICBAYmx1cj0iaGFuZGxlQmx1ciIKICAgIEBjaGFuZ2U9ImhhbmRsZUNoYW5nZSIKICA+CiAgPC9hLXNlbGVjdD4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IFNlbGVjdFR5cGVzIH0gZnJvbSAnYW50LWRlc2lnbi12dWUvZXMvc2VsZWN0JzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3Qgb3B0aW9ucyA9IHJlZjxTZWxlY3RUeXBlc1snb3B0aW9ucyddPihbCiAgICAgIHsgdmFsdWU6ICdqYWNrJywgbGFiZWw6ICdKYWNrJyB9LAogICAgICB7IHZhbHVlOiAnbHVjeScsIGxhYmVsOiAnTHVjeScgfSwKICAgICAgeyB2YWx1ZTogJ3RvbScsIGxhYmVsOiAnVG9tJyB9LAogICAgXSk7CiAgICBjb25zdCBoYW5kbGVDaGFuZ2UgPSAodmFsdWU6IHN0cmluZykgPT4gewogICAgICBjb25zb2xlLmxvZyhgc2VsZWN0ZWQgJHt2YWx1ZX1gKTsKICAgIH07CiAgICBjb25zdCBoYW5kbGVCbHVyID0gKCkgPT4gewogICAgICBjb25zb2xlLmxvZygnYmx1cicpOwogICAgfTsKICAgIGNvbnN0IGhhbmRsZUZvY3VzID0gKCkgPT4gewogICAgICBjb25zb2xlLmxvZygnZm9jdXMnKTsKICAgIH07CiAgICBjb25zdCBmaWx0ZXJPcHRpb24gPSAoaW5wdXQ6IHN0cmluZywgb3B0aW9uOiBhbnkpID0+IHsKICAgICAgcmV0dXJuIG9wdGlvbi52YWx1ZS50b0xvd2VyQ2FzZSgpLmluZGV4T2YoaW5wdXQudG9Mb3dlckNhc2UoKSkgPj0gMDsKICAgIH07CiAgICByZXR1cm4gewogICAgICB2YWx1ZTogcmVmPHN0cmluZyB8IHVuZGVmaW5lZD4odW5kZWZpbmVkKSwKICAgICAgZmlsdGVyT3B0aW9uLAogICAgICBoYW5kbGVCbHVyLAogICAgICBoYW5kbGVGb2N1cywKICAgICAgaGFuZGxlQ2hhbmdlLAogICAgICBvcHRpb25zLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBzaG93LXNlYXJjaAogICAgcGxhY2Vob2xkZXI9IlNlbGVjdCBhIHBlcnNvbiIKICAgIHN0eWxlPSJ3aWR0aDogMjAwcHgiCiAgICA6b3B0aW9ucz0ib3B0aW9ucyIKICAgIEBmb2N1cz0iaGFuZGxlRm9jdXMiCiAgICBAYmx1cj0iaGFuZGxlQmx1ciIKICAgIEBjaGFuZ2U9ImhhbmRsZUNoYW5nZSIKICA+CiAgPC9hLXNlbGVjdD4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3Qgb3B0aW9ucyA9IHJlZihbCiAgICAgIHsKICAgICAgICB2YWx1ZTogJ2phY2snLAogICAgICAgIGxhYmVsOiAnSmFjaycsCiAgICAgIH0sCiAgICAgIHsKICAgICAgICB2YWx1ZTogJ2x1Y3knLAogICAgICAgIGxhYmVsOiAnTHVjeScsCiAgICAgIH0sCiAgICAgIHsKICAgICAgICB2YWx1ZTogJ3RvbScsCiAgICAgICAgbGFiZWw6ICdUb20nLAogICAgICB9LAogICAgXSk7CiAgICBjb25zdCBoYW5kbGVDaGFuZ2UgPSB2YWx1ZSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKGBzZWxlY3RlZCAke3ZhbHVlfWApOwogICAgfTsKICAgIGNvbnN0IGhhbmRsZUJsdXIgPSAoKSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKCdibHVyJyk7CiAgICB9OwogICAgY29uc3QgaGFuZGxlRm9jdXMgPSAoKSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKCdmb2N1cycpOwogICAgfTsKICAgIGNvbnN0IGZpbHRlck9wdGlvbiA9IChpbnB1dCwgb3B0aW9uKSA9PiB7CiAgICAgIHJldHVybiBvcHRpb24udmFsdWUudG9Mb3dlckNhc2UoKS5pbmRleE9mKGlucHV0LnRvTG93ZXJDYXNlKCkpID49IDA7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgdmFsdWU6IHJlZih1bmRlZmluZWQpLAogICAgICBmaWx0ZXJPcHRpb24sCiAgICAgIGhhbmRsZUJsdXIsCiAgICAgIGhhbmRsZUZvY3VzLAogICAgICBoYW5kbGVDaGFuZ2UsCiAgICAgIG9wdGlvbnMsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[e(c,{value:s.value,"onUpdate:value":a[0]||(a[0]=k=>s.value=k),"show-search":"",placeholder:"Select a person",style:{width:"200px"},options:s.options,onFocus:s.handleFocus,onBlur:s.handleBlur,onChange:s.handleChange},null,8,["value","options","onFocus","onBlur","onChange"])]),htmlCode:o(()=>a[1]||(a[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"show-search"),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Select a person"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@focus"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleFocus"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@blur"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleBlur"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" SelectTypes "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue/es/select'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("SelectTypes"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'options'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Jack'"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'tom'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Tom'"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleBlur"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'blur'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleFocus"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'focus'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"filterOption"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"input"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"option"),n("span",{class:"token operator"},":"),t(" any")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"return"),t(" option"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toLowerCase"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"indexOf"),n("span",{class:"token punctuation"},"("),t("input"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toLowerCase"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},">="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" ref"),n("span",{class:"token operator"},"<"),t("string "),n("span",{class:"token operator"},"|"),t(),n("span",{class:"token keyword"},"undefined"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"undefined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- filterOption`),n("span",{class:"token punctuation"},","),t(`
- handleBlur`),n("span",{class:"token punctuation"},","),t(`
- handleFocus`),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"show-search"),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Select a person"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 200px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@focus"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleFocus"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@blur"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleBlur"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'tom'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Tom'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"value"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleBlur"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'blur'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleFocus"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'focus'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"filterOption"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("input"),n("span",{class:"token punctuation"},","),t(" option")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"return"),t(" option"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toLowerCase"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"indexOf"),n("span",{class:"token punctuation"},"("),t("input"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toLowerCase"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},">="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"undefined"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- filterOption`),n("span",{class:"token punctuation"},","),t(`
- handleBlur`),n("span",{class:"token punctuation"},","),t(`
- handleFocus`),n("span",{class:"token punctuation"},","),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var Kn=A(Fn,[["render",xn]]);const Rn=h({setup(){let s=0;const a=P({data:[],value:[],fetching:!1}),l=Q(d=>{console.log("fetching user",d),s+=1;const i=s;a.data=[],a.fetching=!0,fetch("https://randomuser.me/api/?results=5").then(g=>g.json()).then(g=>{if(i!==s)return;const c=g.results.map(u=>({label:`${u.name.first} ${u.name.last}`,value:u.login.username}));a.data=c,a.fetching=!1})},300);return S(a.value,()=>{a.data=[],a.fetching=!1}),{...L(a),fetchUser:l}}});function Pn(s,a,l,d,i,g){const c=p("a-spin"),u=p("a-select"),k=p("demo-box");return b(),y(k,{jsfiddle:{us:"A complete multiple select sample with remote search, debounce fetch, ajax callback order flow, and loading state.",cn:"\u4E00\u4E2A\u5E26\u6709\u8FDC\u7A0B\u641C\u7D22\uFF0C\u8282\u6D41\u63A7\u5236\uFF0C\u8BF7\u6C42\u65F6\u5E8F\u63A7\u5236\uFF0C\u52A0\u8F7D\u72B6\u6001\u7684\u591A\u9009\u793A\u4F8B\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u4E00\u4E2A\u5E26\u6709\u8FDC\u7A0B\u641C\u7D22\uFF0C\u8282\u6D41\u63A7\u5236\uFF0C\u8BF7\u6C42\u65F6\u5E8F\u63A7\u5236\uFF0C\u52A0\u8F7D\u72B6\u6001\u7684\u591A\u9009\u793A\u4F8B\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>A complete multiple select sample with remote search, debounce fetch, ajax callback order flow, and loading state.</p>
- `,order:10,title:{"zh-CN":"\u641C\u7D22\u7528\u6237","en-US":"Search and Select Users"},relativePath:"src/docs/select/demo/select-users.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBtb2RlPSJtdWx0aXBsZSIKICAgIGxhYmVsLWluLXZhbHVlCiAgICBwbGFjZWhvbGRlcj0iU2VsZWN0IHVzZXJzIgogICAgc3R5bGU9IndpZHRoOiAxMDAlIgogICAgOmZpbHRlci1vcHRpb249ImZhbHNlIgogICAgOm5vdC1mb3VuZC1jb250ZW50PSJmZXRjaGluZyA/IHVuZGVmaW5lZCA6IG51bGwiCiAgICA6b3B0aW9ucz0iZGF0YSIKICAgIEBzZWFyY2g9ImZldGNoVXNlciIKICA+CiAgICA8dGVtcGxhdGUgdi1pZj0iZmV0Y2hpbmciICNub3RGb3VuZENvbnRlbnQ+CiAgICAgIDxhLXNwaW4gc2l6ZT0ic21hbGwiIC8+CiAgICA8L3RlbXBsYXRlPgogIDwvYS1zZWxlY3Q+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVhY3RpdmUsIHRvUmVmcywgd2F0Y2ggfSBmcm9tICd2dWUnOwppbXBvcnQgeyBkZWJvdW5jZSB9IGZyb20gJ2xvZGFzaC1lcyc7CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgbGV0IGxhc3RGZXRjaElkID0gMDsKCiAgICBjb25zdCBzdGF0ZSA9IHJlYWN0aXZlKHsKICAgICAgZGF0YTogW10sCiAgICAgIHZhbHVlOiBbXSwKICAgICAgZmV0Y2hpbmc6IGZhbHNlLAogICAgfSk7CgogICAgY29uc3QgZmV0Y2hVc2VyID0gZGVib3VuY2UodmFsdWUgPT4gewogICAgICBjb25zb2xlLmxvZygnZmV0Y2hpbmcgdXNlcicsIHZhbHVlKTsKICAgICAgbGFzdEZldGNoSWQgKz0gMTsKICAgICAgY29uc3QgZmV0Y2hJZCA9IGxhc3RGZXRjaElkOwogICAgICBzdGF0ZS5kYXRhID0gW107CiAgICAgIHN0YXRlLmZldGNoaW5nID0gdHJ1ZTsKICAgICAgZmV0Y2goJ2h0dHBzOi8vcmFuZG9tdXNlci5tZS9hcGkvP3Jlc3VsdHM9NScpCiAgICAgICAgLnRoZW4ocmVzcG9uc2UgPT4gcmVzcG9uc2UuanNvbigpKQogICAgICAgIC50aGVuKGJvZHkgPT4gewogICAgICAgICAgaWYgKGZldGNoSWQgIT09IGxhc3RGZXRjaElkKSB7CiAgICAgICAgICAgIC8vIGZvciBmZXRjaCBjYWxsYmFjayBvcmRlcgogICAgICAgICAgICByZXR1cm47CiAgICAgICAgICB9CiAgICAgICAgICBjb25zdCBkYXRhID0gYm9keS5yZXN1bHRzLm1hcCh1c2VyID0+ICh7CiAgICAgICAgICAgIGxhYmVsOiBgJHt1c2VyLm5hbWUuZmlyc3R9ICR7dXNlci5uYW1lLmxhc3R9YCwKICAgICAgICAgICAgdmFsdWU6IHVzZXIubG9naW4udXNlcm5hbWUsCiAgICAgICAgICB9KSk7CiAgICAgICAgICBzdGF0ZS5kYXRhID0gZGF0YTsKICAgICAgICAgIHN0YXRlLmZldGNoaW5nID0gZmFsc2U7CiAgICAgICAgfSk7CiAgICB9LCAzMDApOwoKICAgIHdhdGNoKHN0YXRlLnZhbHVlLCAoKSA9PiB7CiAgICAgIHN0YXRlLmRhdGEgPSBbXTsKICAgICAgc3RhdGUuZmV0Y2hpbmcgPSBmYWxzZTsKICAgIH0pOwoKICAgIHJldHVybiB7CiAgICAgIC4uLnRvUmVmcyhzdGF0ZSksCiAgICAgIGZldGNoVXNlciwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBtb2RlPSJtdWx0aXBsZSIKICAgIGxhYmVsLWluLXZhbHVlCiAgICBwbGFjZWhvbGRlcj0iU2VsZWN0IHVzZXJzIgogICAgc3R5bGU9IndpZHRoOiAxMDAlIgogICAgOmZpbHRlci1vcHRpb249ImZhbHNlIgogICAgOm5vdC1mb3VuZC1jb250ZW50PSJmZXRjaGluZyA/IHVuZGVmaW5lZCA6IG51bGwiCiAgICA6b3B0aW9ucz0iZGF0YSIKICAgIEBzZWFyY2g9ImZldGNoVXNlciIKICA+CiAgICA8dGVtcGxhdGUgdi1pZj0iZmV0Y2hpbmciICNub3RGb3VuZENvbnRlbnQ+CiAgICAgIDxhLXNwaW4gc2l6ZT0ic21hbGwiIC8+CiAgICA8L3RlbXBsYXRlPgogIDwvYS1zZWxlY3Q+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVhY3RpdmUsIHRvUmVmcywgd2F0Y2ggfSBmcm9tICd2dWUnOwppbXBvcnQgeyBkZWJvdW5jZSB9IGZyb20gJ2xvZGFzaC1lcyc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBsZXQgbGFzdEZldGNoSWQgPSAwOwogICAgY29uc3Qgc3RhdGUgPSByZWFjdGl2ZSh7CiAgICAgIGRhdGE6IFtdLAogICAgICB2YWx1ZTogW10sCiAgICAgIGZldGNoaW5nOiBmYWxzZSwKICAgIH0pOwogICAgY29uc3QgZmV0Y2hVc2VyID0gZGVib3VuY2UodmFsdWUgPT4gewogICAgICBjb25zb2xlLmxvZygnZmV0Y2hpbmcgdXNlcicsIHZhbHVlKTsKICAgICAgbGFzdEZldGNoSWQgKz0gMTsKICAgICAgY29uc3QgZmV0Y2hJZCA9IGxhc3RGZXRjaElkOwogICAgICBzdGF0ZS5kYXRhID0gW107CiAgICAgIHN0YXRlLmZldGNoaW5nID0gdHJ1ZTsKICAgICAgZmV0Y2goJ2h0dHBzOi8vcmFuZG9tdXNlci5tZS9hcGkvP3Jlc3VsdHM9NScpCiAgICAgICAgLnRoZW4ocmVzcG9uc2UgPT4gcmVzcG9uc2UuanNvbigpKQogICAgICAgIC50aGVuKGJvZHkgPT4gewogICAgICAgICAgaWYgKGZldGNoSWQgIT09IGxhc3RGZXRjaElkKSB7CiAgICAgICAgICAgIC8vIGZvciBmZXRjaCBjYWxsYmFjayBvcmRlcgogICAgICAgICAgICByZXR1cm47CiAgICAgICAgICB9CiAgICAgICAgICBjb25zdCBkYXRhID0gYm9keS5yZXN1bHRzLm1hcCh1c2VyID0+ICh7CiAgICAgICAgICAgIGxhYmVsOiBgJHt1c2VyLm5hbWUuZmlyc3R9ICR7dXNlci5uYW1lLmxhc3R9YCwKICAgICAgICAgICAgdmFsdWU6IHVzZXIubG9naW4udXNlcm5hbWUsCiAgICAgICAgICB9KSk7CiAgICAgICAgICBzdGF0ZS5kYXRhID0gZGF0YTsKICAgICAgICAgIHN0YXRlLmZldGNoaW5nID0gZmFsc2U7CiAgICAgICAgfSk7CiAgICB9LCAzMDApOwogICAgd2F0Y2goc3RhdGUudmFsdWUsICgpID0+IHsKICAgICAgc3RhdGUuZGF0YSA9IFtdOwogICAgICBzdGF0ZS5mZXRjaGluZyA9IGZhbHNlOwogICAgfSk7CiAgICByZXR1cm4gewogICAgICAuLi50b1JlZnMoc3RhdGUpLAogICAgICBmZXRjaFVzZXIsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[e(u,{value:s.value,"onUpdate:value":a[0]||(a[0]=C=>s.value=C),mode:"multiple","label-in-value":"",placeholder:"Select users",style:{width:"100%"},"filter-option":!1,"not-found-content":s.fetching?void 0:null,options:s.data,onSearch:s.fetchUser},M({_:2},[s.fetching?{name:"notFoundContent",fn:o(()=>[e(c,{size:"small"})]),key:"0"}:void 0]),1032,["value","not-found-content","options","onSearch"])]),htmlCode:o(()=>a[1]||(a[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"label-in-value"),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Select users"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":filter-option"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":not-found-content"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("fetching ? undefined : null"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("data"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@search"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("fetchUser"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("fetching"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"#notFoundContent"),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-spin")]),t(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("small"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" reactive"),n("span",{class:"token punctuation"},","),t(" toRefs"),n("span",{class:"token punctuation"},","),t(" watch "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" debounce "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'lodash-es'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"let"),t(" lastFetchId "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" state "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"data"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"fetching"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" fetchUser "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"debounce"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"value"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'fetching user'"),n("span",{class:"token punctuation"},","),t(" value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- lastFetchId `),n("span",{class:"token operator"},"+="),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" fetchId "),n("span",{class:"token operator"},"="),t(" lastFetchId"),n("span",{class:"token punctuation"},";"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("fetching "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'https://randomuser.me/api/?results=5'"),n("span",{class:"token punctuation"},")"),t(`
- `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"response"),t(),n("span",{class:"token operator"},"=>"),t(" response"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"json"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),t(`
- `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"body"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("fetchId "),n("span",{class:"token operator"},"!=="),t(" lastFetchId"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token comment"},"// for fetch callback order"),t(`
- `),n("span",{class:"token keyword"},"return"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" data "),n("span",{class:"token operator"},"="),t(" body"),n("span",{class:"token punctuation"},"."),t("results"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"map"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"user"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("user"),n("span",{class:"token punctuation"},"."),t("name"),n("span",{class:"token punctuation"},"."),t("first"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"}," "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("user"),n("span",{class:"token punctuation"},"."),t("name"),n("span",{class:"token punctuation"},"."),t("last"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" user"),n("span",{class:"token punctuation"},"."),t("login"),n("span",{class:"token punctuation"},"."),t("username"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("data "),n("span",{class:"token operator"},"="),t(" data"),n("span",{class:"token punctuation"},";"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("fetching "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"300"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t("state"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("fetching "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"toRefs"),n("span",{class:"token punctuation"},"("),t("state"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- fetchUser`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"label-in-value"),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Select users"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":filter-option"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":not-found-content"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("fetching ? undefined : null"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("data"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@search"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("fetchUser"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("fetching"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"#notFoundContent"),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-spin")]),t(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("small"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" reactive"),n("span",{class:"token punctuation"},","),t(" toRefs"),n("span",{class:"token punctuation"},","),t(" watch "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" debounce "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'lodash-es'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"let"),t(" lastFetchId "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" state "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"data"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"fetching"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" fetchUser "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"debounce"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"value"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'fetching user'"),n("span",{class:"token punctuation"},","),t(" value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- lastFetchId `),n("span",{class:"token operator"},"+="),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" fetchId "),n("span",{class:"token operator"},"="),t(" lastFetchId"),n("span",{class:"token punctuation"},";"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("fetching "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'https://randomuser.me/api/?results=5'"),n("span",{class:"token punctuation"},")"),t(`
- `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"response"),t(),n("span",{class:"token operator"},"=>"),t(" response"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"json"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),t(`
- `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"body"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("fetchId "),n("span",{class:"token operator"},"!=="),t(" lastFetchId"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token comment"},"// for fetch callback order"),t(`
- `),n("span",{class:"token keyword"},"return"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" data "),n("span",{class:"token operator"},"="),t(" body"),n("span",{class:"token punctuation"},"."),t("results"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"map"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"user"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("user"),n("span",{class:"token punctuation"},"."),t("name"),n("span",{class:"token punctuation"},"."),t("first"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"}," "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("user"),n("span",{class:"token punctuation"},"."),t("name"),n("span",{class:"token punctuation"},"."),t("last"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" user"),n("span",{class:"token punctuation"},"."),t("login"),n("span",{class:"token punctuation"},"."),t("username"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("data "),n("span",{class:"token operator"},"="),t(" data"),n("span",{class:"token punctuation"},";"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("fetching "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"300"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t("state"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- state`),n("span",{class:"token punctuation"},"."),t("fetching "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"toRefs"),n("span",{class:"token punctuation"},"("),t("state"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- fetchUser`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var Xn=A(Rn,[["render",Pn]]);const Jn=h({components:{SmileOutlined:tn,MehOutlined:nn},setup(){const s=d=>{console.log(`selected ${d}`)},a=m([{value:"jack",label:"Jack"},{value:"lucy",label:"Lucy"},{value:"disabled",label:"Disabled",disabled:!0},{value:"yiminghe",label:"Yiminghe"}]),l=m([{value:"lucy",label:"Lucy"}]);return{handleChange:s,value1:m("lucy"),value2:m("lucy"),options1:a,options2:l}}});function Dn(s,a,l,d,i,g){const c=p("smile-outlined"),u=p("a-select"),k=p("meh-outlined"),C=p("a-space"),r=p("demo-box");return b(),y(r,{jsfiddle:{us:"Basic Usage",cn:"\u57FA\u672C\u4F7F\u7528\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u57FA\u672C\u4F7F\u7528\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>Basic Usage</p>
- `,order:11,title:{"zh-CN":"\u540E\u7F00\u56FE\u6807","en-US":"Suffix"},relativePath:"src/docs/select/demo/suffix.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlPgogICAgPGEtc2VsZWN0CiAgICAgIHYtbW9kZWw6dmFsdWU9InZhbHVlMSIKICAgICAgc3R5bGU9IndpZHRoOiAxMjBweCIKICAgICAgOm9wdGlvbnM9Im9wdGlvbnMxIgogICAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgICA+CiAgICAgIDx0ZW1wbGF0ZSAjc3VmZml4SWNvbj48c21pbGUtb3V0bGluZWQgLz48L3RlbXBsYXRlPgogICAgPC9hLXNlbGVjdD4KICAgIDxhLXNlbGVjdCB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTIiIHN0eWxlPSJ3aWR0aDogMTIwcHgiIGRpc2FibGVkIDpvcHRpb25zPSJvcHRpb25zMiI+CiAgICAgIDx0ZW1wbGF0ZSAjc3VmZml4SWNvbj48bWVoLW91dGxpbmVkIC8+PC90ZW1wbGF0ZT4KICAgIDwvYS1zZWxlY3Q+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgU21pbGVPdXRsaW5lZCwgTWVoT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwppbXBvcnQgeyBTZWxlY3RUeXBlcyB9IGZyb20gJ2FudC1kZXNpZ24tdnVlL2VzL3NlbGVjdCc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKCmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgY29tcG9uZW50czogewogICAgU21pbGVPdXRsaW5lZCwKICAgIE1laE91dGxpbmVkLAogIH0sCiAgc2V0dXAoKSB7CiAgICBjb25zdCBoYW5kbGVDaGFuZ2UgPSAodmFsdWU6IHN0cmluZykgPT4gewogICAgICBjb25zb2xlLmxvZyhgc2VsZWN0ZWQgJHt2YWx1ZX1gKTsKICAgIH07CgogICAgY29uc3Qgb3B0aW9uczEgPSByZWY8U2VsZWN0VHlwZXNbJ29wdGlvbnMnXT4oWwogICAgICB7CiAgICAgICAgdmFsdWU6ICdqYWNrJywKICAgICAgICBsYWJlbDogJ0phY2snLAogICAgICB9LAogICAgICB7CiAgICAgICAgdmFsdWU6ICdsdWN5JywKICAgICAgICBsYWJlbDogJ0x1Y3knLAogICAgICB9LAogICAgICB7CiAgICAgICAgdmFsdWU6ICdkaXNhYmxlZCcsCiAgICAgICAgbGFiZWw6ICdEaXNhYmxlZCcsCiAgICAgICAgZGlzYWJsZWQ6IHRydWUsCiAgICAgIH0sCiAgICAgIHsKICAgICAgICB2YWx1ZTogJ3lpbWluZ2hlJywKICAgICAgICBsYWJlbDogJ1lpbWluZ2hlJywKICAgICAgfSwKICAgIF0pOwogICAgY29uc3Qgb3B0aW9uczIgPSByZWY8U2VsZWN0VHlwZXNbJ29wdGlvbnMnXT4oWwogICAgICB7CiAgICAgICAgdmFsdWU6ICdsdWN5JywKICAgICAgICBsYWJlbDogJ0x1Y3knLAogICAgICB9LAogICAgXSk7CiAgICByZXR1cm4gewogICAgICBoYW5kbGVDaGFuZ2UsCiAgICAgIHZhbHVlMTogcmVmKCdsdWN5JyksCiAgICAgIHZhbHVlMjogcmVmKCdsdWN5JyksCiAgICAgIG9wdGlvbnMxLAogICAgICBvcHRpb25zMiwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlPgogICAgPGEtc2VsZWN0CiAgICAgIHYtbW9kZWw6dmFsdWU9InZhbHVlMSIKICAgICAgc3R5bGU9IndpZHRoOiAxMjBweCIKICAgICAgOm9wdGlvbnM9Im9wdGlvbnMxIgogICAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgICA+CiAgICAgIDx0ZW1wbGF0ZSAjc3VmZml4SWNvbj48c21pbGUtb3V0bGluZWQgLz48L3RlbXBsYXRlPgogICAgPC9hLXNlbGVjdD4KICAgIDxhLXNlbGVjdCB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTIiIHN0eWxlPSJ3aWR0aDogMTIwcHgiIGRpc2FibGVkIDpvcHRpb25zPSJvcHRpb25zMiI+CiAgICAgIDx0ZW1wbGF0ZSAjc3VmZml4SWNvbj48bWVoLW91dGxpbmVkIC8+PC90ZW1wbGF0ZT4KICAgIDwvYS1zZWxlY3Q+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBTbWlsZU91dGxpbmVkLCBNZWhPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBTbWlsZU91dGxpbmVkLAogICAgTWVoT3V0bGluZWQsCiAgfSwKICBzZXR1cCgpIHsKICAgIGNvbnN0IGhhbmRsZUNoYW5nZSA9IHZhbHVlID0+IHsKICAgICAgY29uc29sZS5sb2coYHNlbGVjdGVkICR7dmFsdWV9YCk7CiAgICB9OwogICAgY29uc3Qgb3B0aW9uczEgPSByZWYoWwogICAgICB7CiAgICAgICAgdmFsdWU6ICdqYWNrJywKICAgICAgICBsYWJlbDogJ0phY2snLAogICAgICB9LAogICAgICB7CiAgICAgICAgdmFsdWU6ICdsdWN5JywKICAgICAgICBsYWJlbDogJ0x1Y3knLAogICAgICB9LAogICAgICB7CiAgICAgICAgdmFsdWU6ICdkaXNhYmxlZCcsCiAgICAgICAgbGFiZWw6ICdEaXNhYmxlZCcsCiAgICAgICAgZGlzYWJsZWQ6IHRydWUsCiAgICAgIH0sCiAgICAgIHsKICAgICAgICB2YWx1ZTogJ3lpbWluZ2hlJywKICAgICAgICBsYWJlbDogJ1lpbWluZ2hlJywKICAgICAgfSwKICAgIF0pOwogICAgY29uc3Qgb3B0aW9uczIgPSByZWYoWwogICAgICB7CiAgICAgICAgdmFsdWU6ICdsdWN5JywKICAgICAgICBsYWJlbDogJ0x1Y3knLAogICAgICB9LAogICAgXSk7CiAgICByZXR1cm4gewogICAgICBoYW5kbGVDaGFuZ2UsCiAgICAgIHZhbHVlMTogcmVmKCdsdWN5JyksCiAgICAgIHZhbHVlMjogcmVmKCdsdWN5JyksCiAgICAgIG9wdGlvbnMxLAogICAgICBvcHRpb25zMiwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[e(C,null,{default:o(()=>[e(u,{value:s.value1,"onUpdate:value":a[0]||(a[0]=I=>s.value1=I),style:{width:"120px"},options:s.options1,onChange:s.handleChange},{suffixIcon:o(()=>[e(c)]),_:1},8,["value","options","onChange"]),e(u,{value:s.value2,"onUpdate:value":a[1]||(a[1]=I=>s.value2=I),style:{width:"120px"},disabled:"",options:s.options2},{suffixIcon:o(()=>[e(k)]),_:1},8,["value","options"])]),_:1})]),htmlCode:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#suffixIcon"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("smile-outlined")]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"disabled"),t(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#suffixIcon"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("meh-outlined")]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" SmileOutlined"),n("span",{class:"token punctuation"},","),t(" MehOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" SelectTypes "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue/es/select'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
- SmileOutlined`),n("span",{class:"token punctuation"},","),t(`
- MehOutlined`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options1 "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("SelectTypes"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'options'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'disabled'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Disabled'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options2 "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("SelectTypes"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'options'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value1"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value2"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- options1`),n("span",{class:"token punctuation"},","),t(`
- options2`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[3]||(a[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options1"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleChange"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#suffixIcon"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("smile-outlined")]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"disabled"),t(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#suffixIcon"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("meh-outlined")]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" SmileOutlined"),n("span",{class:"token punctuation"},","),t(" MehOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
- SmileOutlined`),n("span",{class:"token punctuation"},","),t(`
- MehOutlined`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"value"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options1 "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Jack'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'disabled'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Disabled'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Yiminghe'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options2 "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Lucy'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- handleChange`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value1"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value2"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
- options1`),n("span",{class:"token punctuation"},","),t(`
- options2`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var zn=A(Jn,[["render",Dn]]);const jn=["Apples","Nails","Bananas","Helicopters"],Ln=h({setup(){const s=m([]),a=j(()=>jn.filter(l=>!s.value.includes(l)));return{selectedItems:s,filteredOptions:a}}});function Un(s,a,l,d,i,g){const c=p("a-select"),u=p("demo-box");return b(),y(u,{jsfiddle:{us:"Hide already selected options in the dropdown.",cn:"\u9690\u85CF\u4E0B\u62C9\u5217\u8868\u4E2D\u5DF2\u9009\u62E9\u7684\u9009\u9879\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u9690\u85CF\u4E0B\u62C9\u5217\u8868\u4E2D\u5DF2\u9009\u62E9\u7684\u9009\u9879\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>Hide already selected options in the dropdown.</p>
- `,order:12,title:{"zh-CN":"\u9690\u85CF\u5DF2\u9009\u62E9\u9009\u9879","en-US":"Hide Already Selected"},relativePath:"src/docs/select/demo/hide-selected.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0ic2VsZWN0ZWRJdGVtcyIKICAgIG1vZGU9Im11bHRpcGxlIgogICAgcGxhY2Vob2xkZXI9Ikluc2VydGVkIGFyZSByZW1vdmVkIgogICAgc3R5bGU9IndpZHRoOiAxMDAlIgogICAgOm9wdGlvbnM9ImZpbHRlcmVkT3B0aW9ucy5tYXAoaXRlbSA9PiAoeyB2YWx1ZTogaXRlbSB9KSkiCiAgPgogIDwvYS1zZWxlY3Q+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBjb21wdXRlZCwgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwoKY29uc3QgT1BUSU9OUyA9IFsnQXBwbGVzJywgJ05haWxzJywgJ0JhbmFuYXMnLCAnSGVsaWNvcHRlcnMnXTsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHNlbGVjdGVkSXRlbXMgPSByZWY8c3RyaW5nW10+KFtdKTsKCiAgICBjb25zdCBmaWx0ZXJlZE9wdGlvbnMgPSBjb21wdXRlZCgoKSA9PiBPUFRJT05TLmZpbHRlcihvID0+ICFzZWxlY3RlZEl0ZW1zLnZhbHVlLmluY2x1ZGVzKG8pKSk7CgogICAgcmV0dXJuIHsKICAgICAgc2VsZWN0ZWRJdGVtcywKICAgICAgZmlsdGVyZWRPcHRpb25zLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0ic2VsZWN0ZWRJdGVtcyIKICAgIG1vZGU9Im11bHRpcGxlIgogICAgcGxhY2Vob2xkZXI9Ikluc2VydGVkIGFyZSByZW1vdmVkIgogICAgc3R5bGU9IndpZHRoOiAxMDAlIgogICAgOm9wdGlvbnM9ImZpbHRlcmVkT3B0aW9ucy5tYXAoaXRlbSA9PiAoeyB2YWx1ZTogaXRlbSB9KSkiCiAgPgogIDwvYS1zZWxlY3Q+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGNvbXB1dGVkLCBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmNvbnN0IE9QVElPTlMgPSBbJ0FwcGxlcycsICdOYWlscycsICdCYW5hbmFzJywgJ0hlbGljb3B0ZXJzJ107CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBzZWxlY3RlZEl0ZW1zID0gcmVmKFtdKTsKICAgIGNvbnN0IGZpbHRlcmVkT3B0aW9ucyA9IGNvbXB1dGVkKCgpID0+IE9QVElPTlMuZmlsdGVyKG8gPT4gIXNlbGVjdGVkSXRlbXMudmFsdWUuaW5jbHVkZXMobykpKTsKICAgIHJldHVybiB7CiAgICAgIHNlbGVjdGVkSXRlbXMsCiAgICAgIGZpbHRlcmVkT3B0aW9ucywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[e(c,{value:s.selectedItems,"onUpdate:value":a[0]||(a[0]=k=>s.selectedItems=k),mode:"multiple",placeholder:"Inserted are removed",style:{width:"100%"},options:s.filteredOptions.map(k=>({value:k}))},null,8,["value","options"])]),htmlCode:o(()=>a[1]||(a[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("selectedItems"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Inserted are removed"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("filteredOptions.map(item => ({ value: item }))"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" computed"),n("span",{class:"token punctuation"},","),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token constant"},"OPTIONS"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apples'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Nails'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Bananas'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Helicopters'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" selectedItems "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" filteredOptions "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token constant"},"OPTIONS"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"o"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token operator"},"!"),t("selectedItems"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"includes"),n("span",{class:"token punctuation"},"("),t("o"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- selectedItems`),n("span",{class:"token punctuation"},","),t(`
- filteredOptions`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("selectedItems"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Inserted are removed"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("filteredOptions.map(item => ({ value: item }))"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" computed"),n("span",{class:"token punctuation"},","),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token constant"},"OPTIONS"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apples'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Nails'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Bananas'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'Helicopters'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" selectedItems "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" filteredOptions "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token constant"},"OPTIONS"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"o"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token operator"},"!"),t("selectedItems"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"includes"),n("span",{class:"token punctuation"},"("),t("o"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- selectedItems`),n("span",{class:"token punctuation"},","),t(`
- filteredOptions`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var Tn=A(Ln,[["render",Un]]);let qn=0;const On=h({components:{PlusOutlined:$,VNodes:(s,{attrs:a})=>a.vnodes},setup(){const s=m(["jack","lucy"]),a=m("lucy");return{items:s,value:a,addItem:()=>{console.log("addItem"),s.value.push(`New item ${qn++}`)}}}});function En(s,a,l,d,i,g){const c=p("v-nodes"),u=p("a-divider"),k=p("plus-outlined"),C=p("a-select"),r=p("demo-box");return b(),y(r,{jsfiddle:{us:"Customize the dropdown menu via `dropdownRender`.",cn:"\u4F7F\u7528 `dropdownRender` \u5BF9\u4E0B\u62C9\u83DC\u5355\u8FDB\u884C\u81EA\u7531\u6269\u5C55\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u4F7F\u7528 <code>dropdownRender</code> \u5BF9\u4E0B\u62C9\u83DC\u5355\u8FDB\u884C\u81EA\u7531\u6269\u5C55\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>Customize the dropdown menu via <code>dropdownRender</code>.</p>
- `,order:13,title:{"zh-CN":"\u6269\u5C55\u83DC\u5355","en-US":"Custom dropdown"},relativePath:"src/docs/select/demo/custom-dropdown-menu.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBzdHlsZT0id2lkdGg6IDEyMHB4IgogICAgOm9wdGlvbnM9Iml0ZW1zLm1hcChpdGVtID0+ICh7IHZhbHVlOiBpdGVtIH0pKSIKICA+CiAgICA8dGVtcGxhdGUgI2Ryb3Bkb3duUmVuZGVyPSJ7IG1lbnVOb2RlOiBtZW51IH0iPgogICAgICA8di1ub2RlcyA6dm5vZGVzPSJtZW51IiAvPgogICAgICA8YS1kaXZpZGVyIHN0eWxlPSJtYXJnaW46IDRweCAwIiAvPgogICAgICA8ZGl2CiAgICAgICAgc3R5bGU9InBhZGRpbmc6IDRweCA4cHg7IGN1cnNvcjogcG9pbnRlciIKICAgICAgICBAbW91c2Vkb3duPSJlID0+IGUucHJldmVudERlZmF1bHQoKSIKICAgICAgICBAY2xpY2s9ImFkZEl0ZW0iCiAgICAgID4KICAgICAgICA8cGx1cy1vdXRsaW5lZCAvPgogICAgICAgIEFkZCBpdGVtCiAgICAgIDwvZGl2PgogICAgPC90ZW1wbGF0ZT4KICA8L2Etc2VsZWN0Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgUGx1c091dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwoKbGV0IGluZGV4ID0gMDsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBQbHVzT3V0bGluZWQsCiAgICBWTm9kZXM6IChfLCB7IGF0dHJzIH0pID0+IHsKICAgICAgcmV0dXJuIGF0dHJzLnZub2RlczsKICAgIH0sCiAgfSwKICBzZXR1cCgpIHsKICAgIGNvbnN0IGl0ZW1zID0gcmVmKFsnamFjaycsICdsdWN5J10pOwogICAgY29uc3QgdmFsdWUgPSByZWYoJ2x1Y3knKTsKCiAgICBjb25zdCBhZGRJdGVtID0gKCkgPT4gewogICAgICBjb25zb2xlLmxvZygnYWRkSXRlbScpOwogICAgICBpdGVtcy52YWx1ZS5wdXNoKGBOZXcgaXRlbSAke2luZGV4Kyt9YCk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgaXRlbXMsCiAgICAgIHZhbHVlLAogICAgICBhZGRJdGVtLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNlbGVjdAogICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICBzdHlsZT0id2lkdGg6IDEyMHB4IgogICAgOm9wdGlvbnM9Iml0ZW1zLm1hcChpdGVtID0+ICh7IHZhbHVlOiBpdGVtIH0pKSIKICA+CiAgICA8dGVtcGxhdGUgI2Ryb3Bkb3duUmVuZGVyPSJ7IG1lbnVOb2RlOiBtZW51IH0iPgogICAgICA8di1ub2RlcyA6dm5vZGVzPSJtZW51IiAvPgogICAgICA8YS1kaXZpZGVyIHN0eWxlPSJtYXJnaW46IDRweCAwIiAvPgogICAgICA8ZGl2CiAgICAgICAgc3R5bGU9InBhZGRpbmc6IDRweCA4cHg7IGN1cnNvcjogcG9pbnRlciIKICAgICAgICBAbW91c2Vkb3duPSJlID0+IGUucHJldmVudERlZmF1bHQoKSIKICAgICAgICBAY2xpY2s9ImFkZEl0ZW0iCiAgICAgID4KICAgICAgICA8cGx1cy1vdXRsaW5lZCAvPgogICAgICAgIEFkZCBpdGVtCiAgICAgIDwvZGl2PgogICAgPC90ZW1wbGF0ZT4KICA8L2Etc2VsZWN0Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBQbHVzT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmxldCBpbmRleCA9IDA7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgY29tcG9uZW50czogewogICAgUGx1c091dGxpbmVkLAogICAgVk5vZGVzOiAoXywgeyBhdHRycyB9KSA9PiB7CiAgICAgIHJldHVybiBhdHRycy52bm9kZXM7CiAgICB9LAogIH0sCiAgc2V0dXAoKSB7CiAgICBjb25zdCBpdGVtcyA9IHJlZihbJ2phY2snLCAnbHVjeSddKTsKICAgIGNvbnN0IHZhbHVlID0gcmVmKCdsdWN5Jyk7CiAgICBjb25zdCBhZGRJdGVtID0gKCkgPT4gewogICAgICBjb25zb2xlLmxvZygnYWRkSXRlbScpOwogICAgICBpdGVtcy52YWx1ZS5wdXNoKGBOZXcgaXRlbSAke2luZGV4Kyt9YCk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgaXRlbXMsCiAgICAgIHZhbHVlLAogICAgICBhZGRJdGVtLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[e(C,{value:s.value,"onUpdate:value":a[2]||(a[2]=I=>s.value=I),style:{width:"120px"},options:s.items.map(I=>({value:I}))},{dropdownRender:o(({menuNode:I})=>[e(c,{vnodes:I},null,8,["vnodes"]),e(u,{style:{margin:"4px 0"}}),n("div",{style:{padding:"4px 8px",cursor:"pointer"},onMousedown:a[0]||(a[0]=v=>v.preventDefault()),onClick:a[1]||(a[1]=(...v)=>s.addItem&&s.addItem(...v))},[e(k),a[3]||(a[3]=t(" Add item "))],32)]),_:1},8,["value","options"])]),htmlCode:o(()=>a[4]||(a[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("items.map(item => ({ value: item }))"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dropdownRender"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ menuNode: menu }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("v-nodes")]),t(),n("span",{class:"token attr-name"},":vnodes"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("menu"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-divider")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),t(" 4px 0")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),t(" 4px 8px"),n("span",{class:"token punctuation"},";"),t(),n("span",{class:"token property"},"cursor"),n("span",{class:"token punctuation"},":"),t(" pointer")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"@mousedown"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("e => e.preventDefault()"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("addItem"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("plus-outlined")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- Add item
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" PlusOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"let"),t(" index "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
- PlusOutlined`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token function-variable function"},"VNodes"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("_"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"{"),t(" attrs "),n("span",{class:"token punctuation"},"}")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"return"),t(" attrs"),n("span",{class:"token punctuation"},"."),t("vnodes"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" items "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"addItem"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'addItem'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- items`),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"New item "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("index"),n("span",{class:"token operator"},"++"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- items`),n("span",{class:"token punctuation"},","),t(`
- value`),n("span",{class:"token punctuation"},","),t(`
- addItem`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[5]||(a[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 120px")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("items.map(item => ({ value: item }))"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dropdownRender"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ menuNode: menu }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("v-nodes")]),t(),n("span",{class:"token attr-name"},":vnodes"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("menu"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-divider")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),t(" 4px 0")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),t(" 4px 8px"),n("span",{class:"token punctuation"},";"),t(),n("span",{class:"token property"},"cursor"),n("span",{class:"token punctuation"},":"),t(" pointer")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"@mousedown"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("e => e.preventDefault()"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("addItem"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("plus-outlined")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
- Add item
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" PlusOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"let"),t(" index "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
- PlusOutlined`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token function-variable function"},"VNodes"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("_"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"{"),t(" attrs "),n("span",{class:"token punctuation"},"}")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"return"),t(" attrs"),n("span",{class:"token punctuation"},"."),t("vnodes"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" items "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'jack'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'lucy'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"addItem"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'addItem'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- items`),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"New item "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("index"),n("span",{class:"token operator"},"++"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- items`),n("span",{class:"token punctuation"},","),t(`
- value`),n("span",{class:"token punctuation"},","),t(`
- addItem`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var Qn=A(On,[["render",En]]);const Mn=h({setup(){const s=m(["china"]),a=m([{value:"china",label:"China (\u4E2D\u56FD)",icon:"\u{1F1E8}\u{1F1F3}"},{value:"usa",label:"USA (\u7F8E\u56FD)",icon:"\u{1F1FA}\u{1F1F8}"},{value:"japan",label:"Japan (\u65E5\u672C)",icon:"\u{1F1EF}\u{1F1F5}"},{value:"korea",label:"Korea (\u97E9\u56FD)",icon:"\u{1F1E8}\u{1F1F0}"}]);return S(s,l=>{console.log("selected:",l)}),{options:a,value:s}}}),$n=["aria-label"];function _n(s,a,l,d,i,g){const c=p("a-select-option"),u=p("a-select"),k=p("a-space"),C=p("demo-box");return b(),y(C,{jsfiddle:{us:"Spacified the prop name of Option which will be rendered in select box.",cn:"\u4F7F\u7528 `optionLabelProp` \u6307\u5B9A\u56DE\u586B\u5230\u9009\u62E9\u6846\u7684 `Option` \u5C5E\u6027\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>\u4F7F\u7528 <code>optionLabelProp</code> \u6307\u5B9A\u56DE\u586B\u5230\u9009\u62E9\u6846\u7684 <code>Option</code> \u5C5E\u6027\u3002</p>
- <h2 id="en-us">en-US</h2>
- <p>Spacified the prop name of Option which will be rendered in select box.</p>
- `,order:14,title:{"zh-CN":"\u5B9A\u5236\u56DE\u586B\u5185\u5BB9","en-US":"Custom selection render"},relativePath:"src/docs/select/demo/option-label-prop.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiIHN0eWxlPSJ3aWR0aDogMTAwJSI+CiAgICA8YS1zZWxlY3QKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICAgIG1vZGU9Im11bHRpcGxlIgogICAgICBzdHlsZT0id2lkdGg6IDEwMCUiCiAgICAgIHBsYWNlaG9sZGVyPSJzZWxlY3Qgb25lIGNvdW50cnkiCiAgICAgIG9wdGlvbi1sYWJlbC1wcm9wPSJsYWJlbCIKICAgID4KICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0iY2hpbmEiIGxhYmVsPSJDaGluYSI+CiAgICAgICAgPHNwYW4gcm9sZT0iaW1nIiBhcmlhLWxhYmVsPSJDaGluYSI+8J+HqPCfh7M8L3NwYW4+CiAgICAgICAgJm5ic3A7Jm5ic3A7Q2hpbmEgKOS4reWbvSkKICAgICAgPC9hLXNlbGVjdC1vcHRpb24+CiAgICAgIDxhLXNlbGVjdC1vcHRpb24gdmFsdWU9InVzYSIgbGFiZWw9IlVTQSI+CiAgICAgICAgPHNwYW4gcm9sZT0iaW1nIiBhcmlhLWxhYmVsPSJVU0EiPvCfh7rwn4e4PC9zcGFuPgogICAgICAgICZuYnNwOyZuYnNwO1VTQSAo576O5Zu9KQogICAgICA8L2Etc2VsZWN0LW9wdGlvbj4KICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0iamFwYW4iIGxhYmVsPSJKYXBhbiI+CiAgICAgICAgPHNwYW4gcm9sZT0iaW1nIiBhcmlhLWxhYmVsPSJKYXBhbiI+8J+Hr/Cfh7U8L3NwYW4+CiAgICAgICAgJm5ic3A7Jm5ic3A7SmFwYW4gKOaXpeacrCkKICAgICAgPC9hLXNlbGVjdC1vcHRpb24+CiAgICAgIDxhLXNlbGVjdC1vcHRpb24gdmFsdWU9ImtvcmVhIiBsYWJlbD0iS29yZWEiPgogICAgICAgIDxzcGFuIHJvbGU9ImltZyIgYXJpYS1sYWJlbD0iS29yZWEiPvCfh7Dwn4e3PC9zcGFuPgogICAgICAgICZuYnNwOyZuYnNwO0tvcmVhICjpn6nlm70pCiAgICAgIDwvYS1zZWxlY3Qtb3B0aW9uPgogICAgPC9hLXNlbGVjdD4KCiAgICA8YS1zZWxlY3QKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICAgIG1vZGU9Im11bHRpcGxlIgogICAgICBzdHlsZT0id2lkdGg6IDEwMCUiCiAgICAgIHBsYWNlaG9sZGVyPSJzZWxlY3Qgb25lIGNvdW50cnkiCiAgICAgIG9wdGlvbi1sYWJlbC1wcm9wPSJsYWJlbCIKICAgICAgOm9wdGlvbnM9Im9wdGlvbnMiCiAgICA+CiAgICAgIDx0ZW1wbGF0ZSAjb3B0aW9uPSJ7IHZhbHVlOiB2YWwsIGxhYmVsLCBpY29uIH0iPgogICAgICAgIDxzcGFuIHJvbGU9ImltZyIgOmFyaWEtbGFiZWw9InZhbCI+e3sgaWNvbiB9fTwvc3Bhbj4KICAgICAgICAmbmJzcDsmbmJzcDt7eyBsYWJlbCB9fQogICAgICA8L3RlbXBsYXRlPgogICAgPC9hLXNlbGVjdD4KICAgIDxzcGFuPk5vdGU6IHYtc2xvdDpvcHRpb24gc3VwcG9ydCBmcm9tIHYyLjIuNTwvc3Bhbj4KICA8L2Etc3BhY2U+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiwgd2F0Y2ggfSBmcm9tICd2dWUnOwoKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHZhbHVlID0gcmVmKFsnY2hpbmEnXSk7CgogICAgY29uc3Qgb3B0aW9ucyA9IHJlZihbCiAgICAgIHsKICAgICAgICB2YWx1ZTogJ2NoaW5hJywKICAgICAgICBsYWJlbDogJ0NoaW5hICjkuK3lm70pJywKICAgICAgICBpY29uOiAn8J+HqPCfh7MnLAogICAgICB9LAogICAgICB7CiAgICAgICAgdmFsdWU6ICd1c2EnLAogICAgICAgIGxhYmVsOiAnVVNBICjnvo7lm70pJywKICAgICAgICBpY29uOiAn8J+HuvCfh7gnLAogICAgICB9LAogICAgICB7CiAgICAgICAgdmFsdWU6ICdqYXBhbicsCiAgICAgICAgbGFiZWw6ICdKYXBhbiAo5pel5pysKScsCiAgICAgICAgaWNvbjogJ/Cfh6/wn4e1JywKICAgICAgfSwKICAgICAgewogICAgICAgIHZhbHVlOiAna29yZWEnLAogICAgICAgIGxhYmVsOiAnS29yZWEgKOmfqeWbvSknLAogICAgICAgIGljb246ICfwn4eo8J+HsCcsCiAgICAgIH0sCiAgICBdKTsKICAgIHdhdGNoKHZhbHVlLCB2YWwgPT4gewogICAgICBjb25zb2xlLmxvZyhgc2VsZWN0ZWQ6YCwgdmFsKTsKICAgIH0pOwoKICAgIHJldHVybiB7CiAgICAgIG9wdGlvbnMsCiAgICAgIHZhbHVlLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiIHN0eWxlPSJ3aWR0aDogMTAwJSI+CiAgICA8YS1zZWxlY3QKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICAgIG1vZGU9Im11bHRpcGxlIgogICAgICBzdHlsZT0id2lkdGg6IDEwMCUiCiAgICAgIHBsYWNlaG9sZGVyPSJzZWxlY3Qgb25lIGNvdW50cnkiCiAgICAgIG9wdGlvbi1sYWJlbC1wcm9wPSJsYWJlbCIKICAgID4KICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0iY2hpbmEiIGxhYmVsPSJDaGluYSI+CiAgICAgICAgPHNwYW4gcm9sZT0iaW1nIiBhcmlhLWxhYmVsPSJDaGluYSI+8J+HqPCfh7M8L3NwYW4+CiAgICAgICAgJm5ic3A7Jm5ic3A7Q2hpbmEgKOS4reWbvSkKICAgICAgPC9hLXNlbGVjdC1vcHRpb24+CiAgICAgIDxhLXNlbGVjdC1vcHRpb24gdmFsdWU9InVzYSIgbGFiZWw9IlVTQSI+CiAgICAgICAgPHNwYW4gcm9sZT0iaW1nIiBhcmlhLWxhYmVsPSJVU0EiPvCfh7rwn4e4PC9zcGFuPgogICAgICAgICZuYnNwOyZuYnNwO1VTQSAo576O5Zu9KQogICAgICA8L2Etc2VsZWN0LW9wdGlvbj4KICAgICAgPGEtc2VsZWN0LW9wdGlvbiB2YWx1ZT0iamFwYW4iIGxhYmVsPSJKYXBhbiI+CiAgICAgICAgPHNwYW4gcm9sZT0iaW1nIiBhcmlhLWxhYmVsPSJKYXBhbiI+8J+Hr/Cfh7U8L3NwYW4+CiAgICAgICAgJm5ic3A7Jm5ic3A7SmFwYW4gKOaXpeacrCkKICAgICAgPC9hLXNlbGVjdC1vcHRpb24+CiAgICAgIDxhLXNlbGVjdC1vcHRpb24gdmFsdWU9ImtvcmVhIiBsYWJlbD0iS29yZWEiPgogICAgICAgIDxzcGFuIHJvbGU9ImltZyIgYXJpYS1sYWJlbD0iS29yZWEiPvCfh7Dwn4e3PC9zcGFuPgogICAgICAgICZuYnNwOyZuYnNwO0tvcmVhICjpn6nlm70pCiAgICAgIDwvYS1zZWxlY3Qtb3B0aW9uPgogICAgPC9hLXNlbGVjdD4KCiAgICA8YS1zZWxlY3QKICAgICAgdi1tb2RlbDp2YWx1ZT0idmFsdWUiCiAgICAgIG1vZGU9Im11bHRpcGxlIgogICAgICBzdHlsZT0id2lkdGg6IDEwMCUiCiAgICAgIHBsYWNlaG9sZGVyPSJzZWxlY3Qgb25lIGNvdW50cnkiCiAgICAgIG9wdGlvbi1sYWJlbC1wcm9wPSJsYWJlbCIKICAgICAgOm9wdGlvbnM9Im9wdGlvbnMiCiAgICA+CiAgICAgIDx0ZW1wbGF0ZSAjb3B0aW9uPSJ7IHZhbHVlOiB2YWwsIGxhYmVsLCBpY29uIH0iPgogICAgICAgIDxzcGFuIHJvbGU9ImltZyIgOmFyaWEtbGFiZWw9InZhbCI+e3sgaWNvbiB9fTwvc3Bhbj4KICAgICAgICAmbmJzcDsmbmJzcDt7eyBsYWJlbCB9fQogICAgICA8L3RlbXBsYXRlPgogICAgPC9hLXNlbGVjdD4KICAgIDxzcGFuPk5vdGU6IHYtc2xvdDpvcHRpb24gc3VwcG9ydCBmcm9tIHYyLjIuNTwvc3Bhbj4KICA8L2Etc3BhY2U+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmLCB3YXRjaCB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZSA9IHJlZihbJ2NoaW5hJ10pOwogICAgY29uc3Qgb3B0aW9ucyA9IHJlZihbCiAgICAgIHsKICAgICAgICB2YWx1ZTogJ2NoaW5hJywKICAgICAgICBsYWJlbDogJ0NoaW5hICjkuK3lm70pJywKICAgICAgICBpY29uOiAn8J+HqPCfh7MnLAogICAgICB9LAogICAgICB7CiAgICAgICAgdmFsdWU6ICd1c2EnLAogICAgICAgIGxhYmVsOiAnVVNBICjnvo7lm70pJywKICAgICAgICBpY29uOiAn8J+HuvCfh7gnLAogICAgICB9LAogICAgICB7CiAgICAgICAgdmFsdWU6ICdqYXBhbicsCiAgICAgICAgbGFiZWw6ICdKYXBhbiAo5pel5pysKScsCiAgICAgICAgaWNvbjogJ/Cfh6/wn4e1JywKICAgICAgfSwKICAgICAgewogICAgICAgIHZhbHVlOiAna29yZWEnLAogICAgICAgIGxhYmVsOiAnS29yZWEgKOmfqeWbvSknLAogICAgICAgIGljb246ICfwn4eo8J+HsCcsCiAgICAgIH0sCiAgICBdKTsKICAgIHdhdGNoKHZhbHVlLCB2YWwgPT4gewogICAgICBjb25zb2xlLmxvZyhgc2VsZWN0ZWQ6YCwgdmFsKTsKICAgIH0pOwogICAgcmV0dXJuIHsKICAgICAgb3B0aW9ucywKICAgICAgdmFsdWUsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[e(k,{direction:"vertical",style:{width:"100%"}},{default:o(()=>[e(u,{value:s.value,"onUpdate:value":a[0]||(a[0]=r=>s.value=r),mode:"multiple",style:{width:"100%"},placeholder:"select one country","option-label-prop":"label"},{default:o(()=>[e(c,{value:"china",label:"China"},{default:o(()=>a[2]||(a[2]=[n("span",{role:"img","aria-label":"China"},"\u{1F1E8}\u{1F1F3}",-1),t(" \xA0\xA0China (\u4E2D\u56FD) ")])),_:1,__:[2]}),e(c,{value:"usa",label:"USA"},{default:o(()=>a[3]||(a[3]=[n("span",{role:"img","aria-label":"USA"},"\u{1F1FA}\u{1F1F8}",-1),t(" \xA0\xA0USA (\u7F8E\u56FD) ")])),_:1,__:[3]}),e(c,{value:"japan",label:"Japan"},{default:o(()=>a[4]||(a[4]=[n("span",{role:"img","aria-label":"Japan"},"\u{1F1EF}\u{1F1F5}",-1),t(" \xA0\xA0Japan (\u65E5\u672C) ")])),_:1,__:[4]}),e(c,{value:"korea",label:"Korea"},{default:o(()=>a[5]||(a[5]=[n("span",{role:"img","aria-label":"Korea"},"\u{1F1F0}\u{1F1F7}",-1),t(" \xA0\xA0Korea (\u97E9\u56FD) ")])),_:1,__:[5]})]),_:1},8,["value"]),e(u,{value:s.value,"onUpdate:value":a[1]||(a[1]=r=>s.value=r),mode:"multiple",style:{width:"100%"},placeholder:"select one country","option-label-prop":"label",options:s.options},{option:o(({value:r,label:I,icon:v})=>[n("span",{role:"img","aria-label":r},K(v),9,$n),t(" \xA0\xA0"+K(I),1)]),_:1},8,["value","options"]),a[6]||(a[6]=n("span",null,"Note: v-slot:option support from v2.2.5",-1))]),_:1,__:[6]})]),htmlCode:o(()=>a[7]||(a[7]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("select one country"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"option-label-prop"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("label"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("china"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("China"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"role"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("img"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"aria-label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("China"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("\u{1F1E8}\u{1F1F3}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token entity named-entity",title:"\xA0"}," "),n("span",{class:"token entity named-entity",title:"\xA0"}," "),t(`China (\u4E2D\u56FD)
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("usa"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("USA"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"role"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("img"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"aria-label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("USA"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("\u{1F1FA}\u{1F1F8}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token entity named-entity",title:"\xA0"}," "),n("span",{class:"token entity named-entity",title:"\xA0"}," "),t(`USA (\u7F8E\u56FD)
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("japan"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Japan"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"role"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("img"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"aria-label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Japan"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("\u{1F1EF}\u{1F1F5}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token entity named-entity",title:"\xA0"}," "),n("span",{class:"token entity named-entity",title:"\xA0"}," "),t(`Japan (\u65E5\u672C)
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("korea"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Korea"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"role"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("img"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"aria-label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Korea"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("\u{1F1F0}\u{1F1F7}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token entity named-entity",title:"\xA0"}," "),n("span",{class:"token entity named-entity",title:"\xA0"}," "),t(`Korea (\u97E9\u56FD)
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("select one country"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"option-label-prop"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("label"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#option"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ value: val, label, icon }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"role"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("img"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":aria-label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("val"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("{{ icon }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token entity named-entity",title:"\xA0"}," "),n("span",{class:"token entity named-entity",title:"\xA0"}," "),t(`{{ label }}
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),n("span",{class:"token punctuation"},">")]),t("Note: v-slot:option support from v2.2.5"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref"),n("span",{class:"token punctuation"},","),t(" watch "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'china'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'china'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'China (\u4E2D\u56FD)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u{1F1E8}\u{1F1F3}'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'usa'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'USA (\u7F8E\u56FD)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u{1F1FA}\u{1F1F8}'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'japan'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Japan (\u65E5\u672C)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u{1F1EF}\u{1F1F5}'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'korea'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Korea (\u97E9\u56FD)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u{1F1E8}\u{1F1F0}'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token parameter"},"val"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected:"),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(" val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- value`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[8]||(a[8]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("select one country"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"option-label-prop"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("label"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("china"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("China"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"role"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("img"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"aria-label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("China"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("\u{1F1E8}\u{1F1F3}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token entity named-entity",title:"\xA0"}," "),n("span",{class:"token entity named-entity",title:"\xA0"}," "),t(`China (\u4E2D\u56FD)
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("usa"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("USA"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"role"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("img"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"aria-label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("USA"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("\u{1F1FA}\u{1F1F8}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token entity named-entity",title:"\xA0"}," "),n("span",{class:"token entity named-entity",title:"\xA0"}," "),t(`USA (\u7F8E\u56FD)
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("japan"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Japan"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"role"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("img"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"aria-label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Japan"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("\u{1F1EF}\u{1F1F5}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token entity named-entity",title:"\xA0"}," "),n("span",{class:"token entity named-entity",title:"\xA0"}," "),t(`Japan (\u65E5\u672C)
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("korea"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Korea"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"role"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("img"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"aria-label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Korea"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("\u{1F1F0}\u{1F1F7}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token entity named-entity",title:"\xA0"}," "),n("span",{class:"token entity named-entity",title:"\xA0"}," "),t(`Korea (\u97E9\u56FD)
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select-option")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("select one country"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"option-label-prop"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("label"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#option"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ value: val, label, icon }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"role"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("img"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":aria-label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("val"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("{{ icon }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token entity named-entity",title:"\xA0"}," "),n("span",{class:"token entity named-entity",title:"\xA0"}," "),t(`{{ label }}
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-select")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),n("span",{class:"token punctuation"},">")]),t("Note: v-slot:option support from v2.2.5"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref"),n("span",{class:"token punctuation"},","),t(" watch "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'china'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'china'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'China (\u4E2D\u56FD)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u{1F1E8}\u{1F1F3}'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'usa'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'USA (\u7F8E\u56FD)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u{1F1FA}\u{1F1F8}'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'japan'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Japan (\u65E5\u672C)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u{1F1EF}\u{1F1F5}'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'korea'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Korea (\u97E9\u56FD)'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"icon"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'\u{1F1E8}\u{1F1F0}'"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token parameter"},"val"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
- console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"selected:"),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(" val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- value`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var nt=A(Mn,[["render",_n]]);const q=[];for(let s=0;s<1e4;s++){const a=`${s.toString(36)}${s}`;q.push({value:a,disabled:s===10})}const tt=h({setup(){return P({options:q,value:["a10","c12"]})}});function at(s,a,l,d,i,g){const c=p("a-select"),u=p("demo-box");return b(),y(u,{jsfiddle:{us:"Select use virtual scroll which get better performance than 1.x",cn:"Select \u4F7F\u7528\u4E86\u865A\u62DF\u6EDA\u52A8\u6280\u672F\uFF0C\u56E0\u800C\u83B7\u5F97\u4E86\u6BD4 1.x \u66F4\u597D\u7684\u6027\u80FD",docHtml:`<h2 id="zh-cn">zh-CN</h2>
- <p>Select \u4F7F\u7528\u4E86\u865A\u62DF\u6EDA\u52A8\u6280\u672F\uFF0C\u56E0\u800C\u83B7\u5F97\u4E86\u6BD4 1.x \u66F4\u597D\u7684\u6027\u80FD</p>
- <h2 id="en-us">en-US</h2>
- <p>Select use virtual scroll which get better performance than 1.x</p>
- `,order:15,title:{"zh-CN":"\u5927\u6570\u636E","en-US":"Big Data"},relativePath:"src/docs/select/demo/big-data.vue",sourceCode:"PHRlbXBsYXRlPgogIDxoMj57eyBvcHRpb25zLmxlbmd0aCB9fSBJdGVtczwvaDI+CiAgPGEtc2VsZWN0CiAgICB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIKICAgIG1vZGU9Im11bHRpcGxlIgogICAgc3R5bGU9IndpZHRoOiAxMDAlIgogICAgcGxhY2Vob2xkZXI9IlBsZWFzZSBzZWxlY3QiCiAgICA6b3B0aW9ucz0ib3B0aW9ucyIKICAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWFjdGl2ZSB9IGZyb20gJ3Z1ZSc7CmNvbnN0IG9wdGlvbnM6IHsgdmFsdWU6IHN0cmluZzsgZGlzYWJsZWQ6IGJvb2xlYW4gfVtdID0gW107CmZvciAobGV0IGkgPSAwOyBpIDwgMTAwMDA7IGkrKykgewogIGNvbnN0IHZhbHVlID0gYCR7aS50b1N0cmluZygzNil9JHtpfWA7CiAgb3B0aW9ucy5wdXNoKHsKICAgIHZhbHVlLAogICAgZGlzYWJsZWQ6IGkgPT09IDEwLAogIH0pOwp9CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBzdGF0ZSA9IHJlYWN0aXZlKHsKICAgICAgb3B0aW9ucywKICAgICAgdmFsdWU6IFsnYTEwJywgJ2MxMiddLAogICAgfSk7CiAgICByZXR1cm4gc3RhdGU7CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxoMj57eyBvcHRpb25zLmxlbmd0aCB9fSBJdGVtczwvaDI+CiAgPGEtc2VsZWN0CiAgICB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIKICAgIG1vZGU9Im11bHRpcGxlIgogICAgc3R5bGU9IndpZHRoOiAxMDAlIgogICAgcGxhY2Vob2xkZXI9IlBsZWFzZSBzZWxlY3QiCiAgICA6b3B0aW9ucz0ib3B0aW9ucyIKICAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlYWN0aXZlIH0gZnJvbSAndnVlJzsKY29uc3Qgb3B0aW9ucyA9IFtdOwpmb3IgKGxldCBpID0gMDsgaSA8IDEwMDAwOyBpKyspIHsKICBjb25zdCB2YWx1ZSA9IGAke2kudG9TdHJpbmcoMzYpfSR7aX1gOwogIG9wdGlvbnMucHVzaCh7CiAgICB2YWx1ZSwKICAgIGRpc2FibGVkOiBpID09PSAxMCwKICB9KTsKfQpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3Qgc3RhdGUgPSByZWFjdGl2ZSh7CiAgICAgIG9wdGlvbnMsCiAgICAgIHZhbHVlOiBbJ2ExMCcsICdjMTInXSwKICAgIH0pOwogICAgcmV0dXJuIHN0YXRlOwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[n("h2",null,K(s.options.length)+" Items",1),e(c,{value:s.value,"onUpdate:value":a[0]||(a[0]=k=>s.value=k),mode:"multiple",style:{width:"100%"},placeholder:"Please select",options:s.options},null,8,["value","options"])]),htmlCode:o(()=>a[1]||(a[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("h2")]),n("span",{class:"token punctuation"},">")]),t("{{ options.length }} Items"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("h2")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Please select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" reactive "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token literal-property property"},"options"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(" disabled"),n("span",{class:"token operator"},":"),t(" boolean "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"for"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"let"),t(" i "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),t(" i "),n("span",{class:"token operator"},"<"),t(),n("span",{class:"token number"},"10000"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"36"),n("span",{class:"token punctuation"},")"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),t(`
- options`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- value`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(" i "),n("span",{class:"token operator"},"==="),t(),n("span",{class:"token number"},"10"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" state "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'a10'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'c12'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(" state"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),jsVersionHtml:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("h2")]),n("span",{class:"token punctuation"},">")]),t("{{ options.length }} Items"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("h2")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-select")]),t(`
- `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("multiple"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 100%")]),n("span",{class:"token punctuation"},'"')])]),t(`
- `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Please select"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("options"),n("span",{class:"token punctuation"},'"')]),t(`
- `),n("span",{class:"token punctuation"},"/>")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
- `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" reactive "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"for"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"let"),t(" i "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),t(" i "),n("span",{class:"token operator"},"<"),t(),n("span",{class:"token number"},"10000"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"36"),n("span",{class:"token punctuation"},")"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),t(`
- options`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- value`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(" i "),n("span",{class:"token operator"},"==="),t(),n("span",{class:"token number"},"10"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),t(`
- `),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
- `),n("span",{class:"token keyword"},"const"),t(" state "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
- options`),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'a10'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'c12'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token keyword"},"return"),t(" state"),n("span",{class:"token punctuation"},";"),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
- `)])],-1)])),_:1})}var st=A(tt,[["render",at]]);const ot={pageData:{title:"Select",description:"",frontmatter:{category:"Components",subtitle:"\u9009\u62E9\u5668",type:"\u6570\u636E\u5F55\u5165",title:"Select",cover:"https://gw.alipayobjects.com/zos/alicdn/_0XzgOis7/Select.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:""},{level:2,title:"API",slug:"api",content:""},{level:3,title:"Select props",slug:"select-props",content:""},{level:3,title:"\u4E8B\u4EF6",slug:"\u4E8B\u4EF6",content:""},{level:3,title:"Select Methods",slug:"select-methods",content:""},{level:3,title:"Option props",slug:"option-props",content:""},{level:3,title:"OptGroup props",slug:"optgroup-props",content:""},{level:2,title:"FAQ",slug:"faq",content:"\u70B9\u51FB `dropdownRender` \u91CC\u7684\u5185\u5BB9\u6D6E\u5C42\u5173\u95ED\u600E\u4E48\u529E\uFF1F"},{level:3,title:"\u70B9\u51FB dropdownRender \u91CC\u7684\u5185\u5BB9\u6D6E\u5C42\u5173\u95ED\u600E\u4E48\u529E\uFF1F",slug:"\u70B9\u51FB-dropdownrender-\u91CC\u7684\u5185\u5BB9\u6D6E\u5C42\u5173\u95ED\u600E\u4E48\u529E\uFF1F",content:"\u770B\u4E0B [dropdownRender \u4F8B\u5B50](/components/select-cn/#components-select-demo-custom-dropdown) \u91CC\u7684\u8BF4\u660E\u3002"}],relativePath:"src/docs/select/index.zh-CN.md",content:`
- \u4E0B\u62C9\u9009\u62E9\u5668\u3002
- ## \u4F55\u65F6\u4F7F\u7528
- - \u5F39\u51FA\u4E00\u4E2A\u4E0B\u62C9\u83DC\u5355\u7ED9\u7528\u6237\u9009\u62E9\u64CD\u4F5C\uFF0C\u7528\u4E8E\u4EE3\u66FF\u539F\u751F\u7684\u9009\u62E9\u5668\uFF0C\u6216\u8005\u9700\u8981\u4E00\u4E2A\u66F4\u4F18\u96C5\u7684\u591A\u9009\u5668\u65F6\u3002
- - \u5F53\u9009\u9879\u5C11\u65F6\uFF08\u5C11\u4E8E 5 \u9879\uFF09\uFF0C\u5EFA\u8BAE\u76F4\u63A5\u5C06\u9009\u9879\u5E73\u94FA\uFF0C\u4F7F\u7528 [Radio](/components/radio/) \u662F\u66F4\u597D\u7684\u9009\u62E9\u3002
- ## API
- \`\`\`html
- <a-select>
- <a-select-option value="lucy">lucy</a-select-option>
- </a-select>
- \`\`\`
- ### Select props
- | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |
- | --- | --- | --- | --- | --- |
- | allowClear | \u652F\u6301\u6E05\u9664 | boolean | false | |
- | autoClearSearchValue | \u662F\u5426\u5728\u9009\u4E2D\u9879\u540E\u6E05\u7A7A\u641C\u7D22\u6846\uFF0C\u53EA\u5728 \`mode\` \u4E3A \`multiple\` \u6216 \`tags\` \u65F6\u6709\u6548\u3002 | boolean | true | |
- | autofocus | \u9ED8\u8BA4\u83B7\u53D6\u7126\u70B9 | boolean | false | |
- | bordered | \u662F\u5426\u6709\u8FB9\u6846 | boolean | true | |
- | defaultActiveFirstOption | \u662F\u5426\u9ED8\u8BA4\u9AD8\u4EAE\u7B2C\u4E00\u4E2A\u9009\u9879\u3002 | boolean | true | |
- | disabled | \u662F\u5426\u7981\u7528 | boolean | false | |
- | dropdownClassName | \u4E0B\u62C9\u83DC\u5355\u7684 className \u5C5E\u6027 | string | - | |
- | dropdownMatchSelectWidth | \u4E0B\u62C9\u83DC\u5355\u548C\u9009\u62E9\u5668\u540C\u5BBD | boolean | true | \u300D
- | dropdownRender | \u81EA\u5B9A\u4E49\u4E0B\u62C9\u6846\u5185\u5BB9 | ({menuNode: VNode, props}) => VNode \\| v-slot | - | |
- | dropdownStyle | \u4E0B\u62C9\u83DC\u5355\u7684 style \u5C5E\u6027 | object | - | |
- | dropdownMenuStyle | dropdown \u83DC\u5355\u81EA\u5B9A\u4E49\u6837\u5F0F | object | - | |
- | filterOption | \u662F\u5426\u6839\u636E\u8F93\u5165\u9879\u8FDB\u884C\u7B5B\u9009\u3002\u5F53\u5176\u4E3A\u4E00\u4E2A\u51FD\u6570\u65F6\uFF0C\u4F1A\u63A5\u6536 \`inputValue\` \`option\` \u4E24\u4E2A\u53C2\u6570\uFF0C\u5F53 \`option\` \u7B26\u5408\u7B5B\u9009\u6761\u4EF6\u65F6\uFF0C\u5E94\u8FD4\u56DE \`true\`\uFF0C\u53CD\u4E4B\u5219\u8FD4\u56DE \`false\`\u3002 | boolean or function(inputValue, option) | true | |
- | firstActiveValue | \u9ED8\u8BA4\u9AD8\u4EAE\u7684\u9009\u9879 | string\\|string\\[] | - | |
- | getPopupContainer | \u83DC\u5355\u6E32\u67D3\u7236\u8282\u70B9\u3002\u9ED8\u8BA4\u6E32\u67D3\u5230 body \u4E0A\uFF0C\u5982\u679C\u4F60\u9047\u5230\u83DC\u5355\u6EDA\u52A8\u5B9A\u4F4D\u95EE\u9898\uFF0C\u8BD5\u8BD5\u4FEE\u6539\u4E3A\u6EDA\u52A8\u7684\u533A\u57DF\uFF0C\u5E76\u76F8\u5BF9\u5176\u5B9A\u4F4D\u3002 | Function(triggerNode) | () => document.body | |
- | labelInValue | \u662F\u5426\u628A\u6BCF\u4E2A\u9009\u9879\u7684 label \u5305\u88C5\u5230 value \u4E2D\uFF0C\u4F1A\u628A Select \u7684 value \u7C7B\u578B\u4ECE \`string\` \u53D8\u4E3A \`{key: string, label: vNodes}\` \u7684\u683C\u5F0F | boolean | false | |
- | maxTagCount | \u6700\u591A\u663E\u793A\u591A\u5C11\u4E2A tag | number | - | |
- | maxTagPlaceholder | \u9690\u85CF tag \u65F6\u663E\u793A\u7684\u5185\u5BB9 | slot/function(omittedValues) | - | |
- | maxTagTextLength | \u6700\u5927\u663E\u793A\u7684 tag \u6587\u672C\u957F\u5EA6 | number | - | |
- | mode | \u8BBE\u7F6E Select \u7684\u6A21\u5F0F\u4E3A\u591A\u9009\u6216\u6807\u7B7E | 'multiple' \\| 'tags' \\| 'combobox' | - | |
- | notFoundContent | \u5F53\u4E0B\u62C9\u5217\u8868\u4E3A\u7A7A\u65F6\u663E\u793A\u7684\u5185\u5BB9 | string\\|slot | 'Not Found' | |
- | optionFilterProp | \u641C\u7D22\u65F6\u8FC7\u6EE4\u5BF9\u5E94\u7684 option \u5C5E\u6027\uFF0C\u4E0D\u652F\u6301 children | string | value | |
- | optionLabelProp | \u56DE\u586B\u5230\u9009\u62E9\u6846\u7684 Option \u7684\u5C5E\u6027\u503C\uFF0C\u9ED8\u8BA4\u662F Option \u7684\u5B50\u5143\u7D20\u3002\u6BD4\u5982\u5728\u5B50\u5143\u7D20\u9700\u8981\u9AD8\u4EAE\u6548\u679C\u65F6\uFF0C\u6B64\u503C\u53EF\u4EE5\u8BBE\u4E3A \`value\`\u3002 | string | \`children\` \uFF08combobox \u6A21\u5F0F\u4E0B\u4E3A \`value\`\uFF09 | |
- | placeholder | \u9009\u62E9\u6846\u9ED8\u8BA4\u6587\u5B57 | string\\|slot | - | |
- | showSearch | \u4F7F\u5355\u9009\u6A21\u5F0F\u53EF\u641C\u7D22 | boolean | false | |
- | showArrow | \u662F\u5426\u663E\u793A\u4E0B\u62C9\u5C0F\u7BAD\u5934 | boolean | true | |
- | size | \u9009\u62E9\u6846\u5927\u5C0F\uFF0C\u53EF\u9009 \`large\` \`small\` | string | default | |
- | suffixIcon | \u81EA\u5B9A\u4E49\u7684\u9009\u62E9\u6846\u540E\u7F00\u56FE\u6807 | VNode \\| slot | - | |
- | removeIcon | \u81EA\u5B9A\u4E49\u7684\u591A\u9009\u6846\u6E05\u9664\u56FE\u6807 | VNode \\| slot | - | |
- | clearIcon | \u81EA\u5B9A\u4E49\u7684\u591A\u9009\u6846\u6E05\u7A7A\u56FE\u6807 | VNode \\| slot | - | |
- | menuItemSelectedIcon | \u81EA\u5B9A\u4E49\u5F53\u524D\u9009\u4E2D\u7684\u6761\u76EE\u56FE\u6807 | VNode \\| slot | - | |
- | tokenSeparators | \u5728 tags \u548C multiple \u6A21\u5F0F\u4E0B\u81EA\u52A8\u5206\u8BCD\u7684\u5206\u9694\u7B26 | string\\[] | | |
- | value(v-model) | \u6307\u5B9A\u5F53\u524D\u9009\u4E2D\u7684\u6761\u76EE | string\\|string\\[]\\|number\\|number\\[] | - | |
- | options | options \u6570\u636E\uFF0C\u5982\u679C\u8BBE\u7F6E\u5219\u4E0D\u9700\u8981\u624B\u52A8\u6784\u9020 selectOption \u8282\u70B9 | array&lt;{value, label, [disabled, key, title]}> | \\[] | |
- | option | \u901A\u8FC7 option \u63D2\u69FD\uFF0C\u81EA\u5B9A\u4E49\u8282\u70B9 | v-slot:option="{value, label, [disabled, key, title]}" | - | 2.2.5 |
- | defaultOpen | \u662F\u5426\u9ED8\u8BA4\u5C55\u5F00\u4E0B\u62C9\u83DC\u5355 | boolean | - | |
- | open | \u662F\u5426\u5C55\u5F00\u4E0B\u62C9\u83DC\u5355 | boolean | - | |
- > \u6CE8\u610F\uFF0C\u5982\u679C\u53D1\u73B0\u4E0B\u62C9\u83DC\u5355\u8DDF\u968F\u9875\u9762\u6EDA\u52A8\uFF0C\u6216\u8005\u9700\u8981\u5728\u5176\u4ED6\u5F39\u5C42\u4E2D\u89E6\u53D1 Select\uFF0C\u8BF7\u5C1D\u8BD5\u4F7F\u7528 \`getPopupContainer={triggerNode => triggerNode.parentNode}\` \u5C06\u4E0B\u62C9\u5F39\u5C42\u6E32\u67D3\u8282\u70B9\u56FA\u5B9A\u5728\u89E6\u53D1\u5668\u7684\u7236\u5143\u7D20\u4E2D\u3002
- ### \u4E8B\u4EF6
- | \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E | \u56DE\u8C03\u53C2\u6570 |
- | --- | --- | --- |
- | blur | \u5931\u53BB\u7126\u70B9\u7684\u65F6\u56DE\u8C03 | function |
- | change | \u9009\u4E2D option\uFF0C\u6216 input \u7684 value \u53D8\u5316\uFF08combobox \u6A21\u5F0F\u4E0B\uFF09\u65F6\uFF0C\u8C03\u7528\u6B64\u51FD\u6570 | function(value, option:Option/Array&lt;Option>) |
- | deselect | \u53D6\u6D88\u9009\u4E2D\u65F6\u8C03\u7528\uFF0C\u53C2\u6570\u4E3A\u9009\u4E2D\u9879\u7684 value (\u6216 key) \u503C\uFF0C\u4EC5\u5728 multiple \u6216 tags \u6A21\u5F0F\u4E0B\u751F\u6548 | function(value\uFF0Coption:Option) |
- | focus | \u83B7\u5F97\u7126\u70B9\u65F6\u56DE\u8C03 | function |
- | inputKeyDown | \u952E\u76D8\u6309\u4E0B\u65F6\u56DE\u8C03 | function |
- | mouseenter | \u9F20\u6807\u79FB\u5165\u65F6\u56DE\u8C03 | function |
- | mouseleave | \u9F20\u6807\u79FB\u51FA\u65F6\u56DE\u8C03 | function |
- | popupScroll | \u4E0B\u62C9\u5217\u8868\u6EDA\u52A8\u65F6\u7684\u56DE\u8C03 | function |
- | search | \u6587\u672C\u6846\u503C\u53D8\u5316\u65F6\u56DE\u8C03 | function(value: string) |
- | select | \u88AB\u9009\u4E2D\u65F6\u8C03\u7528\uFF0C\u53C2\u6570\u4E3A\u9009\u4E2D\u9879\u7684 value (\u6216 key) \u503C | function(value, option:Option) |
- | dropdownVisibleChange | \u5C55\u5F00\u4E0B\u62C9\u83DC\u5355\u7684\u56DE\u8C03 | function(open) |
- ### Select Methods
- | \u540D\u79F0 | \u8BF4\u660E |
- | ------- | -------- |
- | blur() | \u53D6\u6D88\u7126\u70B9 |
- | focus() | \u83B7\u53D6\u7126\u70B9 |
- ### Option props
- | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C |
- | --- | --- | --- | --- |
- | disabled | \u662F\u5426\u7981\u7528 | boolean | false |
- | key | \u548C value \u542B\u4E49\u4E00\u81F4\u3002\u5982\u679C Vue \u9700\u8981\u4F60\u8BBE\u7F6E\u6B64\u9879\uFF0C\u6B64\u9879\u503C\u4E0E value \u7684\u503C\u76F8\u540C\uFF0C\u7136\u540E\u53EF\u4EE5\u7701\u7565 value \u8BBE\u7F6E | string | |
- | title | \u9009\u4E2D\u8BE5 Option \u540E\uFF0CSelect \u7684 title | string | - |
- | value | \u9ED8\u8BA4\u6839\u636E\u6B64\u5C5E\u6027\u503C\u8FDB\u884C\u7B5B\u9009 | string\\|number | - |
- | class | Option \u5668\u7C7B\u540D | string | - |
- ### OptGroup props
- | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C |
- | ----- | ---- | --------------------------- | ------ |
- | key | | string | - |
- | label | \u7EC4\u540D | string\\|\\|function(h)\\|slot | \u65E0 |
- ## FAQ
- ### \u70B9\u51FB \`dropdownRender\` \u91CC\u7684\u5185\u5BB9\u6D6E\u5C42\u5173\u95ED\u600E\u4E48\u529E\uFF1F
- \u770B\u4E0B [dropdownRender \u4F8B\u5B50](/components/select-cn/#components-select-demo-custom-dropdown) \u91CC\u7684\u8BF4\u660E\u3002
- `,html:`<p>\u4E0B\u62C9\u9009\u62E9\u5668\u3002</p>
- <h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528</h2>
- <ul>
- <li>\u5F39\u51FA\u4E00\u4E2A\u4E0B\u62C9\u83DC\u5355\u7ED9\u7528\u6237\u9009\u62E9\u64CD\u4F5C\uFF0C\u7528\u4E8E\u4EE3\u66FF\u539F\u751F\u7684\u9009\u62E9\u5668\uFF0C\u6216\u8005\u9700\u8981\u4E00\u4E2A\u66F4\u4F18\u96C5\u7684\u591A\u9009\u5668\u65F6\u3002</li>
- <li>\u5F53\u9009\u9879\u5C11\u65F6\uFF08\u5C11\u4E8E 5 \u9879\uFF09\uFF0C\u5EFA\u8BAE\u76F4\u63A5\u5C06\u9009\u9879\u5E73\u94FA\uFF0C\u4F7F\u7528 <a href="/components/radio/">Radio</a> \u662F\u66F4\u597D\u7684\u9009\u62E9\u3002</li>
- </ul>
- <h2 id="api">API</h2>
- <pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a-select</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a-select-option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>lucy<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>lucy<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a-select-option</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a-select</span><span class="token punctuation">></span></span>
- </code></pre>
- <h3 id="select-props">Select props</h3>
- <table>
- <thead>
- <tr>
- <th>\u53C2\u6570</th>
- <th>\u8BF4\u660E</th>
- <th>\u7C7B\u578B</th>
- <th>\u9ED8\u8BA4\u503C</th>
- <th>\u7248\u672C</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>allowClear</td>
- <td>\u652F\u6301\u6E05\u9664</td>
- <td>boolean</td>
- <td>false</td>
- <td></td>
- </tr>
- <tr>
- <td>autoClearSearchValue</td>
- <td>\u662F\u5426\u5728\u9009\u4E2D\u9879\u540E\u6E05\u7A7A\u641C\u7D22\u6846\uFF0C\u53EA\u5728 <code>mode</code> \u4E3A <code>multiple</code> \u6216 <code>tags</code> \u65F6\u6709\u6548\u3002</td>
- <td>boolean</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>autofocus</td>
- <td>\u9ED8\u8BA4\u83B7\u53D6\u7126\u70B9</td>
- <td>boolean</td>
- <td>false</td>
- <td></td>
- </tr>
- <tr>
- <td>bordered</td>
- <td>\u662F\u5426\u6709\u8FB9\u6846</td>
- <td>boolean</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>defaultActiveFirstOption</td>
- <td>\u662F\u5426\u9ED8\u8BA4\u9AD8\u4EAE\u7B2C\u4E00\u4E2A\u9009\u9879\u3002</td>
- <td>boolean</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>disabled</td>
- <td>\u662F\u5426\u7981\u7528</td>
- <td>boolean</td>
- <td>false</td>
- <td></td>
- </tr>
- <tr>
- <td>dropdownClassName</td>
- <td>\u4E0B\u62C9\u83DC\u5355\u7684 className \u5C5E\u6027</td>
- <td>string</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>dropdownMatchSelectWidth</td>
- <td>\u4E0B\u62C9\u83DC\u5355\u548C\u9009\u62E9\u5668\u540C\u5BBD</td>
- <td>boolean</td>
- <td>true</td>
- <td>\u300D</td>
- </tr>
- <tr>
- <td>dropdownRender</td>
- <td>\u81EA\u5B9A\u4E49\u4E0B\u62C9\u6846\u5185\u5BB9</td>
- <td>({menuNode: VNode, props}) => VNode | v-slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>dropdownStyle</td>
- <td>\u4E0B\u62C9\u83DC\u5355\u7684 style \u5C5E\u6027</td>
- <td>object</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>dropdownMenuStyle</td>
- <td>dropdown \u83DC\u5355\u81EA\u5B9A\u4E49\u6837\u5F0F</td>
- <td>object</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>filterOption</td>
- <td>\u662F\u5426\u6839\u636E\u8F93\u5165\u9879\u8FDB\u884C\u7B5B\u9009\u3002\u5F53\u5176\u4E3A\u4E00\u4E2A\u51FD\u6570\u65F6\uFF0C\u4F1A\u63A5\u6536 <code>inputValue</code> <code>option</code> \u4E24\u4E2A\u53C2\u6570\uFF0C\u5F53 <code>option</code> \u7B26\u5408\u7B5B\u9009\u6761\u4EF6\u65F6\uFF0C\u5E94\u8FD4\u56DE <code>true</code>\uFF0C\u53CD\u4E4B\u5219\u8FD4\u56DE <code>false</code>\u3002</td>
- <td>boolean or function(inputValue, option)</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>firstActiveValue</td>
- <td>\u9ED8\u8BA4\u9AD8\u4EAE\u7684\u9009\u9879</td>
- <td>string|string[]</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>getPopupContainer</td>
- <td>\u83DC\u5355\u6E32\u67D3\u7236\u8282\u70B9\u3002\u9ED8\u8BA4\u6E32\u67D3\u5230 body \u4E0A\uFF0C\u5982\u679C\u4F60\u9047\u5230\u83DC\u5355\u6EDA\u52A8\u5B9A\u4F4D\u95EE\u9898\uFF0C\u8BD5\u8BD5\u4FEE\u6539\u4E3A\u6EDA\u52A8\u7684\u533A\u57DF\uFF0C\u5E76\u76F8\u5BF9\u5176\u5B9A\u4F4D\u3002</td>
- <td>Function(triggerNode)</td>
- <td>() => document.body</td>
- <td></td>
- </tr>
- <tr>
- <td>labelInValue</td>
- <td>\u662F\u5426\u628A\u6BCF\u4E2A\u9009\u9879\u7684 label \u5305\u88C5\u5230 value \u4E2D\uFF0C\u4F1A\u628A Select \u7684 value \u7C7B\u578B\u4ECE <code>string</code> \u53D8\u4E3A <code>{key: string, label: vNodes}</code> \u7684\u683C\u5F0F</td>
- <td>boolean</td>
- <td>false</td>
- <td></td>
- </tr>
- <tr>
- <td>maxTagCount</td>
- <td>\u6700\u591A\u663E\u793A\u591A\u5C11\u4E2A tag</td>
- <td>number</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>maxTagPlaceholder</td>
- <td>\u9690\u85CF tag \u65F6\u663E\u793A\u7684\u5185\u5BB9</td>
- <td>slot/function(omittedValues)</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>maxTagTextLength</td>
- <td>\u6700\u5927\u663E\u793A\u7684 tag \u6587\u672C\u957F\u5EA6</td>
- <td>number</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>mode</td>
- <td>\u8BBE\u7F6E Select \u7684\u6A21\u5F0F\u4E3A\u591A\u9009\u6216\u6807\u7B7E</td>
- <td>'multiple' | 'tags' | 'combobox'</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>notFoundContent</td>
- <td>\u5F53\u4E0B\u62C9\u5217\u8868\u4E3A\u7A7A\u65F6\u663E\u793A\u7684\u5185\u5BB9</td>
- <td>string|slot</td>
- <td>'Not Found'</td>
- <td></td>
- </tr>
- <tr>
- <td>optionFilterProp</td>
- <td>\u641C\u7D22\u65F6\u8FC7\u6EE4\u5BF9\u5E94\u7684 option \u5C5E\u6027\uFF0C\u4E0D\u652F\u6301 children</td>
- <td>string</td>
- <td>value</td>
- <td></td>
- </tr>
- <tr>
- <td>optionLabelProp</td>
- <td>\u56DE\u586B\u5230\u9009\u62E9\u6846\u7684 Option \u7684\u5C5E\u6027\u503C\uFF0C\u9ED8\u8BA4\u662F Option \u7684\u5B50\u5143\u7D20\u3002\u6BD4\u5982\u5728\u5B50\u5143\u7D20\u9700\u8981\u9AD8\u4EAE\u6548\u679C\u65F6\uFF0C\u6B64\u503C\u53EF\u4EE5\u8BBE\u4E3A <code>value</code>\u3002</td>
- <td>string</td>
- <td><code>children</code> \uFF08combobox \u6A21\u5F0F\u4E0B\u4E3A <code>value</code>\uFF09</td>
- <td></td>
- </tr>
- <tr>
- <td>placeholder</td>
- <td>\u9009\u62E9\u6846\u9ED8\u8BA4\u6587\u5B57</td>
- <td>string|slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>showSearch</td>
- <td>\u4F7F\u5355\u9009\u6A21\u5F0F\u53EF\u641C\u7D22</td>
- <td>boolean</td>
- <td>false</td>
- <td></td>
- </tr>
- <tr>
- <td>showArrow</td>
- <td>\u662F\u5426\u663E\u793A\u4E0B\u62C9\u5C0F\u7BAD\u5934</td>
- <td>boolean</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>size</td>
- <td>\u9009\u62E9\u6846\u5927\u5C0F\uFF0C\u53EF\u9009 <code>large</code> <code>small</code></td>
- <td>string</td>
- <td>default</td>
- <td></td>
- </tr>
- <tr>
- <td>suffixIcon</td>
- <td>\u81EA\u5B9A\u4E49\u7684\u9009\u62E9\u6846\u540E\u7F00\u56FE\u6807</td>
- <td>VNode | slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>removeIcon</td>
- <td>\u81EA\u5B9A\u4E49\u7684\u591A\u9009\u6846\u6E05\u9664\u56FE\u6807</td>
- <td>VNode | slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>clearIcon</td>
- <td>\u81EA\u5B9A\u4E49\u7684\u591A\u9009\u6846\u6E05\u7A7A\u56FE\u6807</td>
- <td>VNode | slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>menuItemSelectedIcon</td>
- <td>\u81EA\u5B9A\u4E49\u5F53\u524D\u9009\u4E2D\u7684\u6761\u76EE\u56FE\u6807</td>
- <td>VNode | slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>tokenSeparators</td>
- <td>\u5728 tags \u548C multiple \u6A21\u5F0F\u4E0B\u81EA\u52A8\u5206\u8BCD\u7684\u5206\u9694\u7B26</td>
- <td>string[]</td>
- <td></td>
- <td></td>
- </tr>
- <tr>
- <td>value(v-model)</td>
- <td>\u6307\u5B9A\u5F53\u524D\u9009\u4E2D\u7684\u6761\u76EE</td>
- <td>string|string[]|number|number[]</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>options</td>
- <td>options \u6570\u636E\uFF0C\u5982\u679C\u8BBE\u7F6E\u5219\u4E0D\u9700\u8981\u624B\u52A8\u6784\u9020 selectOption \u8282\u70B9</td>
- <td>array<{value, label, [disabled, key, title]}></td>
- <td>[]</td>
- <td></td>
- </tr>
- <tr>
- <td>option</td>
- <td>\u901A\u8FC7 option \u63D2\u69FD\uFF0C\u81EA\u5B9A\u4E49\u8282\u70B9</td>
- <td>v-slot:option="{value, label, [disabled, key, title]}"</td>
- <td>-</td>
- <td>2.2.5</td>
- </tr>
- <tr>
- <td>defaultOpen</td>
- <td>\u662F\u5426\u9ED8\u8BA4\u5C55\u5F00\u4E0B\u62C9\u83DC\u5355</td>
- <td>boolean</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>open</td>
- <td>\u662F\u5426\u5C55\u5F00\u4E0B\u62C9\u83DC\u5355</td>
- <td>boolean</td>
- <td>-</td>
- <td></td>
- </tr>
- </tbody>
- </table>
- <blockquote>
- <p>\u6CE8\u610F\uFF0C\u5982\u679C\u53D1\u73B0\u4E0B\u62C9\u83DC\u5355\u8DDF\u968F\u9875\u9762\u6EDA\u52A8\uFF0C\u6216\u8005\u9700\u8981\u5728\u5176\u4ED6\u5F39\u5C42\u4E2D\u89E6\u53D1 Select\uFF0C\u8BF7\u5C1D\u8BD5\u4F7F\u7528 <code>getPopupContainer={triggerNode => triggerNode.parentNode}</code> \u5C06\u4E0B\u62C9\u5F39\u5C42\u6E32\u67D3\u8282\u70B9\u56FA\u5B9A\u5728\u89E6\u53D1\u5668\u7684\u7236\u5143\u7D20\u4E2D\u3002</p>
- </blockquote>
- <h3 id="\u4E8B\u4EF6">\u4E8B\u4EF6</h3>
- <table>
- <thead>
- <tr>
- <th>\u4E8B\u4EF6\u540D\u79F0</th>
- <th>\u8BF4\u660E</th>
- <th>\u56DE\u8C03\u53C2\u6570</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>blur</td>
- <td>\u5931\u53BB\u7126\u70B9\u7684\u65F6\u56DE\u8C03</td>
- <td>function</td>
- </tr>
- <tr>
- <td>change</td>
- <td>\u9009\u4E2D option\uFF0C\u6216 input \u7684 value \u53D8\u5316\uFF08combobox \u6A21\u5F0F\u4E0B\uFF09\u65F6\uFF0C\u8C03\u7528\u6B64\u51FD\u6570</td>
- <td>function(value, option:Option/Array<Option>)</td>
- </tr>
- <tr>
- <td>deselect</td>
- <td>\u53D6\u6D88\u9009\u4E2D\u65F6\u8C03\u7528\uFF0C\u53C2\u6570\u4E3A\u9009\u4E2D\u9879\u7684 value (\u6216 key) \u503C\uFF0C\u4EC5\u5728 multiple \u6216 tags \u6A21\u5F0F\u4E0B\u751F\u6548</td>
- <td>function(value\uFF0Coption:Option)</td>
- </tr>
- <tr>
- <td>focus</td>
- <td>\u83B7\u5F97\u7126\u70B9\u65F6\u56DE\u8C03</td>
- <td>function</td>
- </tr>
- <tr>
- <td>inputKeyDown</td>
- <td>\u952E\u76D8\u6309\u4E0B\u65F6\u56DE\u8C03</td>
- <td>function</td>
- </tr>
- <tr>
- <td>mouseenter</td>
- <td>\u9F20\u6807\u79FB\u5165\u65F6\u56DE\u8C03</td>
- <td>function</td>
- </tr>
- <tr>
- <td>mouseleave</td>
- <td>\u9F20\u6807\u79FB\u51FA\u65F6\u56DE\u8C03</td>
- <td>function</td>
- </tr>
- <tr>
- <td>popupScroll</td>
- <td>\u4E0B\u62C9\u5217\u8868\u6EDA\u52A8\u65F6\u7684\u56DE\u8C03</td>
- <td>function</td>
- </tr>
- <tr>
- <td>search</td>
- <td>\u6587\u672C\u6846\u503C\u53D8\u5316\u65F6\u56DE\u8C03</td>
- <td>function(value: string)</td>
- </tr>
- <tr>
- <td>select</td>
- <td>\u88AB\u9009\u4E2D\u65F6\u8C03\u7528\uFF0C\u53C2\u6570\u4E3A\u9009\u4E2D\u9879\u7684 value (\u6216 key) \u503C</td>
- <td>function(value, option:Option)</td>
- </tr>
- <tr>
- <td>dropdownVisibleChange</td>
- <td>\u5C55\u5F00\u4E0B\u62C9\u83DC\u5355\u7684\u56DE\u8C03</td>
- <td>function(open)</td>
- </tr>
- </tbody>
- </table>
- <h3 id="select-methods">Select Methods</h3>
- <table>
- <thead>
- <tr>
- <th>\u540D\u79F0</th>
- <th>\u8BF4\u660E</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>blur()</td>
- <td>\u53D6\u6D88\u7126\u70B9</td>
- </tr>
- <tr>
- <td>focus()</td>
- <td>\u83B7\u53D6\u7126\u70B9</td>
- </tr>
- </tbody>
- </table>
- <h3 id="option-props">Option props</h3>
- <table>
- <thead>
- <tr>
- <th>\u53C2\u6570</th>
- <th>\u8BF4\u660E</th>
- <th>\u7C7B\u578B</th>
- <th>\u9ED8\u8BA4\u503C</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>disabled</td>
- <td>\u662F\u5426\u7981\u7528</td>
- <td>boolean</td>
- <td>false</td>
- </tr>
- <tr>
- <td>key</td>
- <td>\u548C value \u542B\u4E49\u4E00\u81F4\u3002\u5982\u679C Vue \u9700\u8981\u4F60\u8BBE\u7F6E\u6B64\u9879\uFF0C\u6B64\u9879\u503C\u4E0E value \u7684\u503C\u76F8\u540C\uFF0C\u7136\u540E\u53EF\u4EE5\u7701\u7565 value \u8BBE\u7F6E</td>
- <td>string</td>
- <td></td>
- </tr>
- <tr>
- <td>title</td>
- <td>\u9009\u4E2D\u8BE5 Option \u540E\uFF0CSelect \u7684 title</td>
- <td>string</td>
- <td>-</td>
- </tr>
- <tr>
- <td>value</td>
- <td>\u9ED8\u8BA4\u6839\u636E\u6B64\u5C5E\u6027\u503C\u8FDB\u884C\u7B5B\u9009</td>
- <td>string|number</td>
- <td>-</td>
- </tr>
- <tr>
- <td>class</td>
- <td>Option \u5668\u7C7B\u540D</td>
- <td>string</td>
- <td>-</td>
- </tr>
- </tbody>
- </table>
- <h3 id="optgroup-props">OptGroup props</h3>
- <table>
- <thead>
- <tr>
- <th>\u53C2\u6570</th>
- <th>\u8BF4\u660E</th>
- <th>\u7C7B\u578B</th>
- <th>\u9ED8\u8BA4\u503C</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>key</td>
- <td></td>
- <td>string</td>
- <td>-</td>
- </tr>
- <tr>
- <td>label</td>
- <td>\u7EC4\u540D</td>
- <td>string||function(h)|slot</td>
- <td>\u65E0</td>
- </tr>
- </tbody>
- </table>
- <h2 id="faq">FAQ</h2>
- <h3 id="\u70B9\u51FB-dropdownrender-\u91CC\u7684\u5185\u5BB9\u6D6E\u5C42\u5173\u95ED\u600E\u4E48\u529E\uFF1F">\u70B9\u51FB <code>dropdownRender</code> \u91CC\u7684\u5185\u5BB9\u6D6E\u5C42\u5173\u95ED\u600E\u4E48\u529E\uFF1F</h3>
- <p>\u770B\u4E0B <a href="/components/select-cn/#components-select-demo-custom-dropdown">dropdownRender \u4F8B\u5B50</a> \u91CC\u7684\u8BF4\u660E\u3002</p>
- `,lastUpdated:1748059052742}},et={class:"markdown"};function pt(s,a,l,d,i,g){return b(),U("article",et,a[0]||(a[0]=[T(`<p>\u4E0B\u62C9\u9009\u62E9\u5668\u3002</p><h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528</h2><ul><li>\u5F39\u51FA\u4E00\u4E2A\u4E0B\u62C9\u83DC\u5355\u7ED9\u7528\u6237\u9009\u62E9\u64CD\u4F5C\uFF0C\u7528\u4E8E\u4EE3\u66FF\u539F\u751F\u7684\u9009\u62E9\u5668\uFF0C\u6216\u8005\u9700\u8981\u4E00\u4E2A\u66F4\u4F18\u96C5\u7684\u591A\u9009\u5668\u65F6\u3002</li><li>\u5F53\u9009\u9879\u5C11\u65F6\uFF08\u5C11\u4E8E 5 \u9879\uFF09\uFF0C\u5EFA\u8BAE\u76F4\u63A5\u5C06\u9009\u9879\u5E73\u94FA\uFF0C\u4F7F\u7528 <a href="/components/radio/">Radio</a> \u662F\u66F4\u597D\u7684\u9009\u62E9\u3002</li></ul><h2 id="api">API</h2><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a-select</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a-select-option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>lucy<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>lucy<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a-select-option</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a-select</span><span class="token punctuation">></span></span>
- </code></pre><h3 id="select-props">Select props</h3><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th><th>\u7248\u672C</th></tr></thead><tbody><tr><td>allowClear</td><td>\u652F\u6301\u6E05\u9664</td><td>boolean</td><td>false</td><td></td></tr><tr><td>autoClearSearchValue</td><td>\u662F\u5426\u5728\u9009\u4E2D\u9879\u540E\u6E05\u7A7A\u641C\u7D22\u6846\uFF0C\u53EA\u5728 <code>mode</code> \u4E3A <code>multiple</code> \u6216 <code>tags</code> \u65F6\u6709\u6548\u3002</td><td>boolean</td><td>true</td><td></td></tr><tr><td>autofocus</td><td>\u9ED8\u8BA4\u83B7\u53D6\u7126\u70B9</td><td>boolean</td><td>false</td><td></td></tr><tr><td>bordered</td><td>\u662F\u5426\u6709\u8FB9\u6846</td><td>boolean</td><td>true</td><td></td></tr><tr><td>defaultActiveFirstOption</td><td>\u662F\u5426\u9ED8\u8BA4\u9AD8\u4EAE\u7B2C\u4E00\u4E2A\u9009\u9879\u3002</td><td>boolean</td><td>true</td><td></td></tr><tr><td>disabled</td><td>\u662F\u5426\u7981\u7528</td><td>boolean</td><td>false</td><td></td></tr><tr><td>dropdownClassName</td><td>\u4E0B\u62C9\u83DC\u5355\u7684 className \u5C5E\u6027</td><td>string</td><td>-</td><td></td></tr><tr><td>dropdownMatchSelectWidth</td><td>\u4E0B\u62C9\u83DC\u5355\u548C\u9009\u62E9\u5668\u540C\u5BBD</td><td>boolean</td><td>true</td><td>\u300D</td></tr><tr><td>dropdownRender</td><td>\u81EA\u5B9A\u4E49\u4E0B\u62C9\u6846\u5185\u5BB9</td><td>({menuNode: VNode, props}) => VNode | v-slot</td><td>-</td><td></td></tr><tr><td>dropdownStyle</td><td>\u4E0B\u62C9\u83DC\u5355\u7684 style \u5C5E\u6027</td><td>object</td><td>-</td><td></td></tr><tr><td>dropdownMenuStyle</td><td>dropdown \u83DC\u5355\u81EA\u5B9A\u4E49\u6837\u5F0F</td><td>object</td><td>-</td><td></td></tr><tr><td>filterOption</td><td>\u662F\u5426\u6839\u636E\u8F93\u5165\u9879\u8FDB\u884C\u7B5B\u9009\u3002\u5F53\u5176\u4E3A\u4E00\u4E2A\u51FD\u6570\u65F6\uFF0C\u4F1A\u63A5\u6536 <code>inputValue</code> <code>option</code> \u4E24\u4E2A\u53C2\u6570\uFF0C\u5F53 <code>option</code> \u7B26\u5408\u7B5B\u9009\u6761\u4EF6\u65F6\uFF0C\u5E94\u8FD4\u56DE <code>true</code>\uFF0C\u53CD\u4E4B\u5219\u8FD4\u56DE <code>false</code>\u3002</td><td>boolean or function(inputValue, option)</td><td>true</td><td></td></tr><tr><td>firstActiveValue</td><td>\u9ED8\u8BA4\u9AD8\u4EAE\u7684\u9009\u9879</td><td>string|string[]</td><td>-</td><td></td></tr><tr><td>getPopupContainer</td><td>\u83DC\u5355\u6E32\u67D3\u7236\u8282\u70B9\u3002\u9ED8\u8BA4\u6E32\u67D3\u5230 body \u4E0A\uFF0C\u5982\u679C\u4F60\u9047\u5230\u83DC\u5355\u6EDA\u52A8\u5B9A\u4F4D\u95EE\u9898\uFF0C\u8BD5\u8BD5\u4FEE\u6539\u4E3A\u6EDA\u52A8\u7684\u533A\u57DF\uFF0C\u5E76\u76F8\u5BF9\u5176\u5B9A\u4F4D\u3002</td><td>Function(triggerNode)</td><td>() => document.body</td><td></td></tr><tr><td>labelInValue</td><td>\u662F\u5426\u628A\u6BCF\u4E2A\u9009\u9879\u7684 label \u5305\u88C5\u5230 value \u4E2D\uFF0C\u4F1A\u628A Select \u7684 value \u7C7B\u578B\u4ECE <code>string</code> \u53D8\u4E3A <code>{key: string, label: vNodes}</code> \u7684\u683C\u5F0F</td><td>boolean</td><td>false</td><td></td></tr><tr><td>maxTagCount</td><td>\u6700\u591A\u663E\u793A\u591A\u5C11\u4E2A tag</td><td>number</td><td>-</td><td></td></tr><tr><td>maxTagPlaceholder</td><td>\u9690\u85CF tag \u65F6\u663E\u793A\u7684\u5185\u5BB9</td><td>slot/function(omittedValues)</td><td>-</td><td></td></tr><tr><td>maxTagTextLength</td><td>\u6700\u5927\u663E\u793A\u7684 tag \u6587\u672C\u957F\u5EA6</td><td>number</td><td>-</td><td></td></tr><tr><td>mode</td><td>\u8BBE\u7F6E Select \u7684\u6A21\u5F0F\u4E3A\u591A\u9009\u6216\u6807\u7B7E</td><td>'multiple' | 'tags' | 'combobox'</td><td>-</td><td></td></tr><tr><td>notFoundContent</td><td>\u5F53\u4E0B\u62C9\u5217\u8868\u4E3A\u7A7A\u65F6\u663E\u793A\u7684\u5185\u5BB9</td><td>string|slot</td><td>'Not Found'</td><td></td></tr><tr><td>optionFilterProp</td><td>\u641C\u7D22\u65F6\u8FC7\u6EE4\u5BF9\u5E94\u7684 option \u5C5E\u6027\uFF0C\u4E0D\u652F\u6301 children</td><td>string</td><td>value</td><td></td></tr><tr><td>optionLabelProp</td><td>\u56DE\u586B\u5230\u9009\u62E9\u6846\u7684 Option \u7684\u5C5E\u6027\u503C\uFF0C\u9ED8\u8BA4\u662F Option \u7684\u5B50\u5143\u7D20\u3002\u6BD4\u5982\u5728\u5B50\u5143\u7D20\u9700\u8981\u9AD8\u4EAE\u6548\u679C\u65F6\uFF0C\u6B64\u503C\u53EF\u4EE5\u8BBE\u4E3A <code>value</code>\u3002</td><td>string</td><td><code>children</code> \uFF08combobox \u6A21\u5F0F\u4E0B\u4E3A <code>value</code>\uFF09</td><td></td></tr><tr><td>placeholder</td><td>\u9009\u62E9\u6846\u9ED8\u8BA4\u6587\u5B57</td><td>string|slot</td><td>-</td><td></td></tr><tr><td>showSearch</td><td>\u4F7F\u5355\u9009\u6A21\u5F0F\u53EF\u641C\u7D22</td><td>boolean</td><td>false</td><td></td></tr><tr><td>showArrow</td><td>\u662F\u5426\u663E\u793A\u4E0B\u62C9\u5C0F\u7BAD\u5934</td><td>boolean</td><td>true</td><td></td></tr><tr><td>size</td><td>\u9009\u62E9\u6846\u5927\u5C0F\uFF0C\u53EF\u9009 <code>large</code> <code>small</code></td><td>string</td><td>default</td><td></td></tr><tr><td>suffixIcon</td><td>\u81EA\u5B9A\u4E49\u7684\u9009\u62E9\u6846\u540E\u7F00\u56FE\u6807</td><td>VNode | slot</td><td>-</td><td></td></tr><tr><td>removeIcon</td><td>\u81EA\u5B9A\u4E49\u7684\u591A\u9009\u6846\u6E05\u9664\u56FE\u6807</td><td>VNode | slot</td><td>-</td><td></td></tr><tr><td>clearIcon</td><td>\u81EA\u5B9A\u4E49\u7684\u591A\u9009\u6846\u6E05\u7A7A\u56FE\u6807</td><td>VNode | slot</td><td>-</td><td></td></tr><tr><td>menuItemSelectedIcon</td><td>\u81EA\u5B9A\u4E49\u5F53\u524D\u9009\u4E2D\u7684\u6761\u76EE\u56FE\u6807</td><td>VNode | slot</td><td>-</td><td></td></tr><tr><td>tokenSeparators</td><td>\u5728 tags \u548C multiple \u6A21\u5F0F\u4E0B\u81EA\u52A8\u5206\u8BCD\u7684\u5206\u9694\u7B26</td><td>string[]</td><td></td><td></td></tr><tr><td>value(v-model)</td><td>\u6307\u5B9A\u5F53\u524D\u9009\u4E2D\u7684\u6761\u76EE</td><td>string|string[]|number|number[]</td><td>-</td><td></td></tr><tr><td>options</td><td>options \u6570\u636E\uFF0C\u5982\u679C\u8BBE\u7F6E\u5219\u4E0D\u9700\u8981\u624B\u52A8\u6784\u9020 selectOption \u8282\u70B9</td><td>array<{value, label, [disabled, key, title]}></td><td>[]</td><td></td></tr><tr><td>option</td><td>\u901A\u8FC7 option \u63D2\u69FD\uFF0C\u81EA\u5B9A\u4E49\u8282\u70B9</td><td>v-slot:option="{value, label, [disabled, key, title]}"</td><td>-</td><td>2.2.5</td></tr><tr><td>defaultOpen</td><td>\u662F\u5426\u9ED8\u8BA4\u5C55\u5F00\u4E0B\u62C9\u83DC\u5355</td><td>boolean</td><td>-</td><td></td></tr><tr><td>open</td><td>\u662F\u5426\u5C55\u5F00\u4E0B\u62C9\u83DC\u5355</td><td>boolean</td><td>-</td><td></td></tr></tbody></table><blockquote><p>\u6CE8\u610F\uFF0C\u5982\u679C\u53D1\u73B0\u4E0B\u62C9\u83DC\u5355\u8DDF\u968F\u9875\u9762\u6EDA\u52A8\uFF0C\u6216\u8005\u9700\u8981\u5728\u5176\u4ED6\u5F39\u5C42\u4E2D\u89E6\u53D1 Select\uFF0C\u8BF7\u5C1D\u8BD5\u4F7F\u7528 <code>getPopupContainer={triggerNode => triggerNode.parentNode}</code> \u5C06\u4E0B\u62C9\u5F39\u5C42\u6E32\u67D3\u8282\u70B9\u56FA\u5B9A\u5728\u89E6\u53D1\u5668\u7684\u7236\u5143\u7D20\u4E2D\u3002</p></blockquote><h3 id="\u4E8B\u4EF6">\u4E8B\u4EF6</h3><table><thead><tr><th>\u4E8B\u4EF6\u540D\u79F0</th><th>\u8BF4\u660E</th><th>\u56DE\u8C03\u53C2\u6570</th></tr></thead><tbody><tr><td>blur</td><td>\u5931\u53BB\u7126\u70B9\u7684\u65F6\u56DE\u8C03</td><td>function</td></tr><tr><td>change</td><td>\u9009\u4E2D option\uFF0C\u6216 input \u7684 value \u53D8\u5316\uFF08combobox \u6A21\u5F0F\u4E0B\uFF09\u65F6\uFF0C\u8C03\u7528\u6B64\u51FD\u6570</td><td>function(value, option:Option/Array<Option>)</td></tr><tr><td>deselect</td><td>\u53D6\u6D88\u9009\u4E2D\u65F6\u8C03\u7528\uFF0C\u53C2\u6570\u4E3A\u9009\u4E2D\u9879\u7684 value (\u6216 key) \u503C\uFF0C\u4EC5\u5728 multiple \u6216 tags \u6A21\u5F0F\u4E0B\u751F\u6548</td><td>function(value\uFF0Coption:Option)</td></tr><tr><td>focus</td><td>\u83B7\u5F97\u7126\u70B9\u65F6\u56DE\u8C03</td><td>function</td></tr><tr><td>inputKeyDown</td><td>\u952E\u76D8\u6309\u4E0B\u65F6\u56DE\u8C03</td><td>function</td></tr><tr><td>mouseenter</td><td>\u9F20\u6807\u79FB\u5165\u65F6\u56DE\u8C03</td><td>function</td></tr><tr><td>mouseleave</td><td>\u9F20\u6807\u79FB\u51FA\u65F6\u56DE\u8C03</td><td>function</td></tr><tr><td>popupScroll</td><td>\u4E0B\u62C9\u5217\u8868\u6EDA\u52A8\u65F6\u7684\u56DE\u8C03</td><td>function</td></tr><tr><td>search</td><td>\u6587\u672C\u6846\u503C\u53D8\u5316\u65F6\u56DE\u8C03</td><td>function(value: string)</td></tr><tr><td>select</td><td>\u88AB\u9009\u4E2D\u65F6\u8C03\u7528\uFF0C\u53C2\u6570\u4E3A\u9009\u4E2D\u9879\u7684 value (\u6216 key) \u503C</td><td>function(value, option:Option)</td></tr><tr><td>dropdownVisibleChange</td><td>\u5C55\u5F00\u4E0B\u62C9\u83DC\u5355\u7684\u56DE\u8C03</td><td>function(open)</td></tr></tbody></table><h3 id="select-methods">Select Methods</h3><table><thead><tr><th>\u540D\u79F0</th><th>\u8BF4\u660E</th></tr></thead><tbody><tr><td>blur()</td><td>\u53D6\u6D88\u7126\u70B9</td></tr><tr><td>focus()</td><td>\u83B7\u53D6\u7126\u70B9</td></tr></tbody></table><h3 id="option-props">Option props</h3><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th></tr></thead><tbody><tr><td>disabled</td><td>\u662F\u5426\u7981\u7528</td><td>boolean</td><td>false</td></tr><tr><td>key</td><td>\u548C value \u542B\u4E49\u4E00\u81F4\u3002\u5982\u679C Vue \u9700\u8981\u4F60\u8BBE\u7F6E\u6B64\u9879\uFF0C\u6B64\u9879\u503C\u4E0E value \u7684\u503C\u76F8\u540C\uFF0C\u7136\u540E\u53EF\u4EE5\u7701\u7565 value \u8BBE\u7F6E</td><td>string</td><td></td></tr><tr><td>title</td><td>\u9009\u4E2D\u8BE5 Option \u540E\uFF0CSelect \u7684 title</td><td>string</td><td>-</td></tr><tr><td>value</td><td>\u9ED8\u8BA4\u6839\u636E\u6B64\u5C5E\u6027\u503C\u8FDB\u884C\u7B5B\u9009</td><td>string|number</td><td>-</td></tr><tr><td>class</td><td>Option \u5668\u7C7B\u540D</td><td>string</td><td>-</td></tr></tbody></table><h3 id="optgroup-props">OptGroup props</h3><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th></tr></thead><tbody><tr><td>key</td><td></td><td>string</td><td>-</td></tr><tr><td>label</td><td>\u7EC4\u540D</td><td>string||function(h)|slot</td><td>\u65E0</td></tr></tbody></table><h2 id="faq">FAQ</h2><h3 id="\u70B9\u51FB-dropdownrender-\u91CC\u7684\u5185\u5BB9\u6D6E\u5C42\u5173\u95ED\u600E\u4E48\u529E\uFF1F">\u70B9\u51FB <code>dropdownRender</code> \u91CC\u7684\u5185\u5BB9\u6D6E\u5C42\u5173\u95ED\u600E\u4E48\u529E\uFF1F</h3><p>\u770B\u4E0B <a href="/components/select-cn/#components-select-demo-custom-dropdown">dropdownRender \u4F8B\u5B50</a> \u91CC\u7684\u8BF4\u660E\u3002</p>`,19)]))}var ct=A(ot,[["render",pt]]);const lt={pageData:{title:"Select",description:"",frontmatter:{category:"Components",type:"Data Entry",title:"Select",cover:"https://gw.alipayobjects.com/zos/alicdn/_0XzgOis7/Select.svg"},headers:[{level:2,title:"When To Use",slug:"when-to-use",content:""},{level:2,title:"API",slug:"api",content:""},{level:3,title:"Select props",slug:"select-props",content:""},{level:3,title:"events",slug:"events",content:""},{level:3,title:"Select Methods",slug:"select-methods",content:""},{level:3,title:"Option props",slug:"option-props",content:""},{level:3,title:"OptGroup props",slug:"optgroup-props",content:""},{level:2,title:"FAQ",slug:"faq",content:"The dropdown is closed when click `dropdownRender` area?"},{level:3,title:"The dropdown is closed when click dropdownRender area?",slug:"the-dropdown-is-closed-when-click-dropdownrender-area",content:"See the [dropdownRender example](/components/select/#components-select-demo-custom-dropdown)."}],relativePath:"src/docs/select/index.en-US.md",content:`
- Select component to select value from options.
- ## When To Use
- - A dropdown menu for displaying choices - an elegant alternative to the native \`<select>\` element.
- - Utilizing [Radio](/components/radio/) is recommended when there are fewer total options (less than 5).
- ## API
- \`\`\`html
- <a-select>
- <a-select-option value="lucy">lucy</a-select-option>
- </a-select>
- \`\`\`
- ### Select props
- | Property | Description | Type | Default | Version |
- | --- | --- | --- | --- | --- |
- | allowClear | Show clear button. | boolean | false | |
- | autoClearSearchValue | Whether the current search will be cleared on selecting an item. Only applies when \`mode\` is set to \`multiple\` or \`tags\`. | boolean | true | |
- | autofocus | Get focus by default | boolean | false | |
- | bordered | Whether has border style | boolean | true | |
- | defaultActiveFirstOption | Whether active first option by default | boolean | true | |
- | disabled | Whether disabled select | boolean | false | |
- | dropdownClassName | className of dropdown menu | string | - | |
- | dropdownMatchSelectWidth | Whether dropdown's width is same with select. | boolean | true | |
- | dropdownRender | Customize dropdown content | ({menuNode: VNode, props}) => VNode \\| v-slot | - | |
- | dropdownStyle | style of dropdown menu | object | - | |
- | dropdownMenuStyle | additional style applied to dropdown menu | object | - | |
- | filterOption | If true, filter options by input, if function, filter options against it. The function will receive two arguments, \`inputValue\` and \`option\`, if the function returns \`true\`, the option will be included in the filtered set; Otherwise, it will be excluded. | boolean or function(inputValue, option) | true | |
- | firstActiveValue | Value of action option by default | string\\|string\\[] | - | |
- | getPopupContainer | Parent Node which the selector should be rendered to. Default to \`body\`. When position issues happen, try to modify it into scrollable content and position it relative. | function(triggerNode) | () => document.body | |
- | labelInValue | whether to embed label in value, turn the format of value from \`string\` to \`{key: string, label: vNodes}\` | boolean | false | |
- | maxTagCount | Max tag count to show | number | - | |
- | maxTagPlaceholder | Placeholder for not showing tags | slot/function(omittedValues) | - | |
- | maxTagTextLength | Max text length to show | number | - | |
- | mode | Set mode of Select | 'multiple' \\| 'tags' | - | |
- | notFoundContent | Specify content to show when no result matches.. | string\\|slot | 'Not Found' | |
- | optionFilterProp | Which prop value of option will be used for filter if filterOption is true | string | value | |
- | optionLabelProp | Which prop value of option will render as content of select. | string | \`value\` for \`combobox\`, \`children\` for other modes | |
- | placeholder | Placeholder of select | string\\|slot | - | |
- | showSearch | Whether show search input in single mode. | boolean | false | |
- | showArrow | Whether to show the drop-down arrow | boolean | true | |
- | size | Size of Select input. \`default\` \`large\` \`small\` | string | default | |
- | suffixIcon | The custom suffix icon | VNode \\| slot | - | |
- | removeIcon | The custom remove icon | VNode \\| slot | - | |
- | clearIcon | The custom clear icon | VNode \\| slot | - | |
- | menuItemSelectedIcon | The custom menuItemSelected icon | VNode \\| slot | - | |
- | tokenSeparators | Separator used to tokenize on tag/multiple mode | string\\[] | | |
- | value(v-model) | Current selected option. | string\\|number\\|string\\[]\\|number\\[] | - | |
- | options | Data of the selectOption, manual construction work is no longer needed if this property has been set | array&lt;{value, label, [disabled, key, title]}> | \\[] | |
- | option | custom render option by slot | v-slot:option="{value, label, [disabled, key, title]}" | - | 2.2.5 |
- | defaultOpen | Initial open state of dropdown | boolean | - | |
- | open | Controlled open state of dropdown | boolean | - | |
- | loading | indicate loading state | Boolean | false | |
- > Note, if you find that the drop-down menu scrolls with the page, or you need to trigger Select in other popup layers, please try to use \`getPopupContainer={triggerNode => triggerNode.parentElement}\` to fix the drop-down popup rendering node in the parent element of the trigger .
- ### events
- | Events Name | Description | Arguments |
- | --- | --- | --- |
- | blur | Called when blur | function |
- | change | Called when select an option or input value change, or value of input is changed in combobox mode | function(value, option:Option/Array&lt;Option>) |
- | deselect | 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. | function(value, option:Option) |
- | focus | Called when focus | function |
- | inputKeyDown | Called when key pressed | function |
- | mouseenter | Called when mouse enter | function |
- | mouseleave | Called when mouse leave | function |
- | popupScroll | Called when dropdown scrolls | function |
- | search | Callback function that is fired when input changed. | function(value: string) |
- | select | Called when a option is selected, the params are option's value (or key) and option instance. | function(value, option:Option) |
- | dropdownVisibleChange | Call when dropdown open | function(open) |
- ### Select Methods
- | Name | Description |
- | ------- | ------------ |
- | blur() | Remove focus |
- | focus() | Get focus |
- ### Option props
- | Property | Description | Type | Default |
- | --- | --- | --- | --- |
- | disabled | Disable this option | boolean | false |
- | key | Same usage as \`value\`. If Vue request you to set this property, you can set it to value of option, and then omit value property. | string | |
- | title | \`title\` of Select after select this Option | string | - |
- | value | default to filter with this property | string\\|number | - |
- | class | additional class to option | string | - |
- ### OptGroup props
- | Property | Description | Type | Default |
- | -------- | ----------- | ------------ | ------- |
- | key | | string | - |
- | label | Group label | string\\|slot | - |
- ## FAQ
- ### The dropdown is closed when click \`dropdownRender\` area?
- See the [dropdownRender example](/components/select/#components-select-demo-custom-dropdown).
- `,html:`<p>Select component to select value from options.</p>
- <h2 id="when-to-use">When To Use</h2>
- <ul>
- <li>A dropdown menu for displaying choices - an elegant alternative to the native <code><select></code> element.</li>
- <li>Utilizing <a href="/components/radio/">Radio</a> is recommended when there are fewer total options (less than 5).</li>
- </ul>
- <h2 id="api">API</h2>
- <pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a-select</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a-select-option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>lucy<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>lucy<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a-select-option</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a-select</span><span class="token punctuation">></span></span>
- </code></pre>
- <h3 id="select-props">Select props</h3>
- <table>
- <thead>
- <tr>
- <th>Property</th>
- <th>Description</th>
- <th>Type</th>
- <th>Default</th>
- <th>Version</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>allowClear</td>
- <td>Show clear button.</td>
- <td>boolean</td>
- <td>false</td>
- <td></td>
- </tr>
- <tr>
- <td>autoClearSearchValue</td>
- <td>Whether the current search will be cleared on selecting an item. Only applies when <code>mode</code> is set to <code>multiple</code> or <code>tags</code>.</td>
- <td>boolean</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>autofocus</td>
- <td>Get focus by default</td>
- <td>boolean</td>
- <td>false</td>
- <td></td>
- </tr>
- <tr>
- <td>bordered</td>
- <td>Whether has border style</td>
- <td>boolean</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>defaultActiveFirstOption</td>
- <td>Whether active first option by default</td>
- <td>boolean</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>disabled</td>
- <td>Whether disabled select</td>
- <td>boolean</td>
- <td>false</td>
- <td></td>
- </tr>
- <tr>
- <td>dropdownClassName</td>
- <td>className of dropdown menu</td>
- <td>string</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>dropdownMatchSelectWidth</td>
- <td>Whether dropdown's width is same with select.</td>
- <td>boolean</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>dropdownRender</td>
- <td>Customize dropdown content</td>
- <td>({menuNode: VNode, props}) => VNode | v-slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>dropdownStyle</td>
- <td>style of dropdown menu</td>
- <td>object</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>dropdownMenuStyle</td>
- <td>additional style applied to dropdown menu</td>
- <td>object</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>filterOption</td>
- <td>If true, filter options by input, if function, filter options against it. The function will receive two arguments, <code>inputValue</code> and <code>option</code>, if the function returns <code>true</code>, the option will be included in the filtered set; Otherwise, it will be excluded.</td>
- <td>boolean or function(inputValue, option)</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>firstActiveValue</td>
- <td>Value of action option by default</td>
- <td>string|string[]</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>getPopupContainer</td>
- <td>Parent Node which the selector should be rendered to. Default to <code>body</code>. When position issues happen, try to modify it into scrollable content and position it relative.</td>
- <td>function(triggerNode)</td>
- <td>() => document.body</td>
- <td></td>
- </tr>
- <tr>
- <td>labelInValue</td>
- <td>whether to embed label in value, turn the format of value from <code>string</code> to <code>{key: string, label: vNodes}</code></td>
- <td>boolean</td>
- <td>false</td>
- <td></td>
- </tr>
- <tr>
- <td>maxTagCount</td>
- <td>Max tag count to show</td>
- <td>number</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>maxTagPlaceholder</td>
- <td>Placeholder for not showing tags</td>
- <td>slot/function(omittedValues)</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>maxTagTextLength</td>
- <td>Max text length to show</td>
- <td>number</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>mode</td>
- <td>Set mode of Select</td>
- <td>'multiple' | 'tags'</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>notFoundContent</td>
- <td>Specify content to show when no result matches..</td>
- <td>string|slot</td>
- <td>'Not Found'</td>
- <td></td>
- </tr>
- <tr>
- <td>optionFilterProp</td>
- <td>Which prop value of option will be used for filter if filterOption is true</td>
- <td>string</td>
- <td>value</td>
- <td></td>
- </tr>
- <tr>
- <td>optionLabelProp</td>
- <td>Which prop value of option will render as content of select.</td>
- <td>string</td>
- <td><code>value</code> for <code>combobox</code>, <code>children</code> for other modes</td>
- <td></td>
- </tr>
- <tr>
- <td>placeholder</td>
- <td>Placeholder of select</td>
- <td>string|slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>showSearch</td>
- <td>Whether show search input in single mode.</td>
- <td>boolean</td>
- <td>false</td>
- <td></td>
- </tr>
- <tr>
- <td>showArrow</td>
- <td>Whether to show the drop-down arrow</td>
- <td>boolean</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>size</td>
- <td>Size of Select input. <code>default</code> <code>large</code> <code>small</code></td>
- <td>string</td>
- <td>default</td>
- <td></td>
- </tr>
- <tr>
- <td>suffixIcon</td>
- <td>The custom suffix icon</td>
- <td>VNode | slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>removeIcon</td>
- <td>The custom remove icon</td>
- <td>VNode | slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>clearIcon</td>
- <td>The custom clear icon</td>
- <td>VNode | slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>menuItemSelectedIcon</td>
- <td>The custom menuItemSelected icon</td>
- <td>VNode | slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>tokenSeparators</td>
- <td>Separator used to tokenize on tag/multiple mode</td>
- <td>string[]</td>
- <td></td>
- <td></td>
- </tr>
- <tr>
- <td>value(v-model)</td>
- <td>Current selected option.</td>
- <td>string|number|string[]|number[]</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>options</td>
- <td>Data of the selectOption, manual construction work is no longer needed if this property has been set</td>
- <td>array<{value, label, [disabled, key, title]}></td>
- <td>[]</td>
- <td></td>
- </tr>
- <tr>
- <td>option</td>
- <td>custom render option by slot</td>
- <td>v-slot:option="{value, label, [disabled, key, title]}"</td>
- <td>-</td>
- <td>2.2.5</td>
- </tr>
- <tr>
- <td>defaultOpen</td>
- <td>Initial open state of dropdown</td>
- <td>boolean</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>open</td>
- <td>Controlled open state of dropdown</td>
- <td>boolean</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>loading</td>
- <td>indicate loading state</td>
- <td>Boolean</td>
- <td>false</td>
- <td></td>
- </tr>
- </tbody>
- </table>
- <blockquote>
- <p>Note, if you find that the drop-down menu scrolls with the page, or you need to trigger Select in other popup layers, please try to use <code>getPopupContainer={triggerNode => triggerNode.parentElement}</code> to fix the drop-down popup rendering node in the parent element of the trigger .</p>
- </blockquote>
- <h3 id="events">events</h3>
- <table>
- <thead>
- <tr>
- <th>Events Name</th>
- <th>Description</th>
- <th>Arguments</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>blur</td>
- <td>Called when blur</td>
- <td>function</td>
- </tr>
- <tr>
- <td>change</td>
- <td>Called when select an option or input value change, or value of input is changed in combobox mode</td>
- <td>function(value, option:Option/Array<Option>)</td>
- </tr>
- <tr>
- <td>deselect</td>
- <td>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.</td>
- <td>function(value, option:Option)</td>
- </tr>
- <tr>
- <td>focus</td>
- <td>Called when focus</td>
- <td>function</td>
- </tr>
- <tr>
- <td>inputKeyDown</td>
- <td>Called when key pressed</td>
- <td>function</td>
- </tr>
- <tr>
- <td>mouseenter</td>
- <td>Called when mouse enter</td>
- <td>function</td>
- </tr>
- <tr>
- <td>mouseleave</td>
- <td>Called when mouse leave</td>
- <td>function</td>
- </tr>
- <tr>
- <td>popupScroll</td>
- <td>Called when dropdown scrolls</td>
- <td>function</td>
- </tr>
- <tr>
- <td>search</td>
- <td>Callback function that is fired when input changed.</td>
- <td>function(value: string)</td>
- </tr>
- <tr>
- <td>select</td>
- <td>Called when a option is selected, the params are option's value (or key) and option instance.</td>
- <td>function(value, option:Option)</td>
- </tr>
- <tr>
- <td>dropdownVisibleChange</td>
- <td>Call when dropdown open</td>
- <td>function(open)</td>
- </tr>
- </tbody>
- </table>
- <h3 id="select-methods">Select Methods</h3>
- <table>
- <thead>
- <tr>
- <th>Name</th>
- <th>Description</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>blur()</td>
- <td>Remove focus</td>
- </tr>
- <tr>
- <td>focus()</td>
- <td>Get focus</td>
- </tr>
- </tbody>
- </table>
- <h3 id="option-props">Option props</h3>
- <table>
- <thead>
- <tr>
- <th>Property</th>
- <th>Description</th>
- <th>Type</th>
- <th>Default</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>disabled</td>
- <td>Disable this option</td>
- <td>boolean</td>
- <td>false</td>
- </tr>
- <tr>
- <td>key</td>
- <td>Same usage as <code>value</code>. If Vue request you to set this property, you can set it to value of option, and then omit value property.</td>
- <td>string</td>
- <td></td>
- </tr>
- <tr>
- <td>title</td>
- <td><code>title</code> of Select after select this Option</td>
- <td>string</td>
- <td>-</td>
- </tr>
- <tr>
- <td>value</td>
- <td>default to filter with this property</td>
- <td>string|number</td>
- <td>-</td>
- </tr>
- <tr>
- <td>class</td>
- <td>additional class to option</td>
- <td>string</td>
- <td>-</td>
- </tr>
- </tbody>
- </table>
- <h3 id="optgroup-props">OptGroup props</h3>
- <table>
- <thead>
- <tr>
- <th>Property</th>
- <th>Description</th>
- <th>Type</th>
- <th>Default</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>key</td>
- <td></td>
- <td>string</td>
- <td>-</td>
- </tr>
- <tr>
- <td>label</td>
- <td>Group label</td>
- <td>string|slot</td>
- <td>-</td>
- </tr>
- </tbody>
- </table>
- <h2 id="faq">FAQ</h2>
- <h3 id="the-dropdown-is-closed-when-click-dropdownrender-area">The dropdown is closed when click <code>dropdownRender</code> area?</h3>
- <p>See the <a href="/components/select/#components-select-demo-custom-dropdown">dropdownRender example</a>.</p>
- `,lastUpdated:1748059052741}},ut={class:"markdown"};function it(s,a,l,d,i,g){return b(),U("article",ut,a[0]||(a[0]=[T(`<p>Select component to select value from options.</p><h2 id="when-to-use">When To Use</h2><ul><li>A dropdown menu for displaying choices - an elegant alternative to the native <code><select></code> element.</li><li>Utilizing <a href="/components/radio/">Radio</a> is recommended when there are fewer total options (less than 5).</li></ul><h2 id="api">API</h2><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a-select</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a-select-option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>lucy<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>lucy<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a-select-option</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a-select</span><span class="token punctuation">></span></span>
- </code></pre><h3 id="select-props">Select props</h3><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th><th>Version</th></tr></thead><tbody><tr><td>allowClear</td><td>Show clear button.</td><td>boolean</td><td>false</td><td></td></tr><tr><td>autoClearSearchValue</td><td>Whether the current search will be cleared on selecting an item. Only applies when <code>mode</code> is set to <code>multiple</code> or <code>tags</code>.</td><td>boolean</td><td>true</td><td></td></tr><tr><td>autofocus</td><td>Get focus by default</td><td>boolean</td><td>false</td><td></td></tr><tr><td>bordered</td><td>Whether has border style</td><td>boolean</td><td>true</td><td></td></tr><tr><td>defaultActiveFirstOption</td><td>Whether active first option by default</td><td>boolean</td><td>true</td><td></td></tr><tr><td>disabled</td><td>Whether disabled select</td><td>boolean</td><td>false</td><td></td></tr><tr><td>dropdownClassName</td><td>className of dropdown menu</td><td>string</td><td>-</td><td></td></tr><tr><td>dropdownMatchSelectWidth</td><td>Whether dropdown's width is same with select.</td><td>boolean</td><td>true</td><td></td></tr><tr><td>dropdownRender</td><td>Customize dropdown content</td><td>({menuNode: VNode, props}) => VNode | v-slot</td><td>-</td><td></td></tr><tr><td>dropdownStyle</td><td>style of dropdown menu</td><td>object</td><td>-</td><td></td></tr><tr><td>dropdownMenuStyle</td><td>additional style applied to dropdown menu</td><td>object</td><td>-</td><td></td></tr><tr><td>filterOption</td><td>If true, filter options by input, if function, filter options against it. The function will receive two arguments, <code>inputValue</code> and <code>option</code>, if the function returns <code>true</code>, the option will be included in the filtered set; Otherwise, it will be excluded.</td><td>boolean or function(inputValue, option)</td><td>true</td><td></td></tr><tr><td>firstActiveValue</td><td>Value of action option by default</td><td>string|string[]</td><td>-</td><td></td></tr><tr><td>getPopupContainer</td><td>Parent Node which the selector should be rendered to. Default to <code>body</code>. When position issues happen, try to modify it into scrollable content and position it relative.</td><td>function(triggerNode)</td><td>() => document.body</td><td></td></tr><tr><td>labelInValue</td><td>whether to embed label in value, turn the format of value from <code>string</code> to <code>{key: string, label: vNodes}</code></td><td>boolean</td><td>false</td><td></td></tr><tr><td>maxTagCount</td><td>Max tag count to show</td><td>number</td><td>-</td><td></td></tr><tr><td>maxTagPlaceholder</td><td>Placeholder for not showing tags</td><td>slot/function(omittedValues)</td><td>-</td><td></td></tr><tr><td>maxTagTextLength</td><td>Max text length to show</td><td>number</td><td>-</td><td></td></tr><tr><td>mode</td><td>Set mode of Select</td><td>'multiple' | 'tags'</td><td>-</td><td></td></tr><tr><td>notFoundContent</td><td>Specify content to show when no result matches..</td><td>string|slot</td><td>'Not Found'</td><td></td></tr><tr><td>optionFilterProp</td><td>Which prop value of option will be used for filter if filterOption is true</td><td>string</td><td>value</td><td></td></tr><tr><td>optionLabelProp</td><td>Which prop value of option will render as content of select.</td><td>string</td><td><code>value</code> for <code>combobox</code>, <code>children</code> for other modes</td><td></td></tr><tr><td>placeholder</td><td>Placeholder of select</td><td>string|slot</td><td>-</td><td></td></tr><tr><td>showSearch</td><td>Whether show search input in single mode.</td><td>boolean</td><td>false</td><td></td></tr><tr><td>showArrow</td><td>Whether to show the drop-down arrow</td><td>boolean</td><td>true</td><td></td></tr><tr><td>size</td><td>Size of Select input. <code>default</code> <code>large</code> <code>small</code></td><td>string</td><td>default</td><td></td></tr><tr><td>suffixIcon</td><td>The custom suffix icon</td><td>VNode | slot</td><td>-</td><td></td></tr><tr><td>removeIcon</td><td>The custom remove icon</td><td>VNode | slot</td><td>-</td><td></td></tr><tr><td>clearIcon</td><td>The custom clear icon</td><td>VNode | slot</td><td>-</td><td></td></tr><tr><td>menuItemSelectedIcon</td><td>The custom menuItemSelected icon</td><td>VNode | slot</td><td>-</td><td></td></tr><tr><td>tokenSeparators</td><td>Separator used to tokenize on tag/multiple mode</td><td>string[]</td><td></td><td></td></tr><tr><td>value(v-model)</td><td>Current selected option.</td><td>string|number|string[]|number[]</td><td>-</td><td></td></tr><tr><td>options</td><td>Data of the selectOption, manual construction work is no longer needed if this property has been set</td><td>array<{value, label, [disabled, key, title]}></td><td>[]</td><td></td></tr><tr><td>option</td><td>custom render option by slot</td><td>v-slot:option="{value, label, [disabled, key, title]}"</td><td>-</td><td>2.2.5</td></tr><tr><td>defaultOpen</td><td>Initial open state of dropdown</td><td>boolean</td><td>-</td><td></td></tr><tr><td>open</td><td>Controlled open state of dropdown</td><td>boolean</td><td>-</td><td></td></tr><tr><td>loading</td><td>indicate loading state</td><td>Boolean</td><td>false</td><td></td></tr></tbody></table><blockquote><p>Note, if you find that the drop-down menu scrolls with the page, or you need to trigger Select in other popup layers, please try to use <code>getPopupContainer={triggerNode => triggerNode.parentElement}</code> to fix the drop-down popup rendering node in the parent element of the trigger .</p></blockquote><h3 id="events">events</h3><table><thead><tr><th>Events Name</th><th>Description</th><th>Arguments</th></tr></thead><tbody><tr><td>blur</td><td>Called when blur</td><td>function</td></tr><tr><td>change</td><td>Called when select an option or input value change, or value of input is changed in combobox mode</td><td>function(value, option:Option/Array<Option>)</td></tr><tr><td>deselect</td><td>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.</td><td>function(value, option:Option)</td></tr><tr><td>focus</td><td>Called when focus</td><td>function</td></tr><tr><td>inputKeyDown</td><td>Called when key pressed</td><td>function</td></tr><tr><td>mouseenter</td><td>Called when mouse enter</td><td>function</td></tr><tr><td>mouseleave</td><td>Called when mouse leave</td><td>function</td></tr><tr><td>popupScroll</td><td>Called when dropdown scrolls</td><td>function</td></tr><tr><td>search</td><td>Callback function that is fired when input changed.</td><td>function(value: string)</td></tr><tr><td>select</td><td>Called when a option is selected, the params are option's value (or key) and option instance.</td><td>function(value, option:Option)</td></tr><tr><td>dropdownVisibleChange</td><td>Call when dropdown open</td><td>function(open)</td></tr></tbody></table><h3 id="select-methods">Select Methods</h3><table><thead><tr><th>Name</th><th>Description</th></tr></thead><tbody><tr><td>blur()</td><td>Remove focus</td></tr><tr><td>focus()</td><td>Get focus</td></tr></tbody></table><h3 id="option-props">Option props</h3><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th></tr></thead><tbody><tr><td>disabled</td><td>Disable this option</td><td>boolean</td><td>false</td></tr><tr><td>key</td><td>Same usage as <code>value</code>. If Vue request you to set this property, you can set it to value of option, and then omit value property.</td><td>string</td><td></td></tr><tr><td>title</td><td><code>title</code> of Select after select this Option</td><td>string</td><td>-</td></tr><tr><td>value</td><td>default to filter with this property</td><td>string|number</td><td>-</td></tr><tr><td>class</td><td>additional class to option</td><td>string</td><td>-</td></tr></tbody></table><h3 id="optgroup-props">OptGroup props</h3><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th></tr></thead><tbody><tr><td>key</td><td></td><td>string</td><td>-</td></tr><tr><td>label</td><td>Group label</td><td>string|slot</td><td>-</td></tr></tbody></table><h2 id="faq">FAQ</h2><h3 id="the-dropdown-is-closed-when-click-dropdownrender-area">The dropdown is closed when click <code>dropdownRender</code> area?</h3><p>See the <a href="/components/select/#components-select-demo-custom-dropdown">dropdownRender example</a>.</p>`,19)]))}var kt=A(lt,[["render",it]]);const rt=h({CN:ct,US:kt,components:{Basic:on,Size:cn,Tags:kn,AutomaticTokenization:gn,LabelInValue:mn,Multiple:vn,Coordinate:wn,Optgroup:Wn,SearchBox:Nn,Search:Kn,SelectUsers:Xn,Suffix:zn,HideSelected:Tn,CustomDropdownMenu:Qn,OptionLabelProp:nt,BigData:st},setup(){return{}}});function dt(s,a,l,d,i,g){const c=p("Basic"),u=p("Size"),k=p("Tags"),C=p("AutomaticTokenization"),r=p("LabelInValue"),I=p("Multiple"),v=p("Coordinate"),w=p("Optgroup"),Z=p("SearchBox"),N=p("Search"),Y=p("SelectUsers"),f=p("Suffix"),G=p("HideSelected"),W=p("CustomDropdownMenu"),F=p("OptionLabelProp"),X=p("BigData"),O=p("demo-sort");return b(),y(O,null,{default:o(()=>[e(c),e(u),e(k),e(C),e(r),e(I),e(v),e(w),e(Z),e(N),e(Y),e(f),e(G),e(W),e(F),e(X)]),_:1})}var At=A(rt,[["render",dt]]);export{At as default};
|