홈 탐색 도움말
가입하기 로그인
wicresoft
/
doc_project
2
0
포크 0
파일 이슈 0 풀 리퀘스트 0 위키
트리: bf1fb50bbd
브랜치 태그
doc_project
/
2x.antv.design
/
assets
/
index.4873cad2.js

index.4873cad2.js 309 KB
히스토리 Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740 
  1. import{U as J,bc as T,bd as x,be as j,bf as L,bg as E,bh as P,bi as W,bj as U,d as G,r as A,_ as b,j as r,k as h,l as Z,w as k,b as n,f as C,e as t,o as K,t as R,v as q,c as Q,q as M,a as B,n as Y}from"./index.c1b9962e.js";var O=200;function $(s,a,p,I){var l=-1,u=j,o=!0,e=s.length,c=[],i=a.length;if(!e)return c;p&&(a=J(a,T(p))),I?(u=L,o=!1):a.length>=O&&(u=E,o=!1,a=new x(a));n:for(;++l<e;){var d=s[l],g=p==null?d:p(d);if(d=I||d!==0?d:0,o&&g===g){for(var m=i;m--;)if(a[m]===g)continue n;c.push(d)}else u(a,g,I)||c.push(d)}return c}var _=P(function(s,a){return W(s)?$(s,U(a,1,W,!0)):[]}),X=_;const v=[];for(let s=0;s<20;s++)v.push({key:s.toString(),title:`content${s+1}`,description:`description of content${s+1}`,disabled:s%3<1});const nn=v.filter(s=>+s.key%3>1).map(s=>s.key),tn=G({data(){const s=A(!1),a=A(nn),p=A(["1","4"]);return{mockData:v,targetKeys:a,selectedKeys:p,disabled:s,handleChange:(o,e,c)=>{a.value=o,console.log("targetKeys: ",o),console.log("direction: ",e),console.log("moveKeys: ",c)},handleSelectChange:(o,e)=>{p.value=[...o,...e],console.log("sourceSelectedKeys: ",o),console.log("targetSelectedKeys: ",e)},handleScroll:(o,e)=>{console.log("direction:",o),console.log("target:",e.target)}}}});function sn(s,a,p,I,l,u){const o=r("a-transfer"),e=r("a-switch"),c=r("demo-box");return h(),Z(c,{jsfiddle:{us:"The most basic usage of `Transfer` involves providing the source data and target keys arrays, plus the rendering and some callback functions.",cn:"\u6700\u57FA\u672C\u7684\u7528\u6CD5\uFF0C\u5C55\u793A\u4E86 `dataSource`\u3001`targetKeys`\u3001\u6BCF\u884C\u7684\u6E32\u67D3\u51FD\u6570 `render` \u4EE5\u53CA\u56DE\u8C03\u51FD\u6570 `change` `selectChange` `scroll` \u7684\u7528\u6CD5\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
    2. 

  2. <p>\u6700\u57FA\u672C\u7684\u7528\u6CD5\uFF0C\u5C55\u793A\u4E86 <code>dataSource</code>\u3001<code>targetKeys</code>\u3001\u6BCF\u884C\u7684\u6E32\u67D3\u51FD\u6570 <code>render</code> \u4EE5\u53CA\u56DE\u8C03\u51FD\u6570 <code>change</code> <code>selectChange</code> <code>scroll</code> \u7684\u7528\u6CD5\u3002</p>
    3. 

  3. <h2 id="en-us">en-US</h2>
    4. 

  4. <p>The most basic usage of <code>Transfer</code> involves providing the source data and target keys arrays, plus the rendering and some callback functions.</p>
    5. 

  5. `,order:0,title:{"zh-CN":"\u57FA\u672C\u7528\u6CD5","en-US":"Basic usage"},relativePath:"src/docs/transfer/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS10cmFuc2ZlcgogICAgICA6ZGF0YS1zb3VyY2U9Im1vY2tEYXRhIgogICAgICA6dGl0bGVzPSJbJ1NvdXJjZScsICdUYXJnZXQnXSIKICAgICAgOnRhcmdldC1rZXlzPSJ0YXJnZXRLZXlzIgogICAgICA6c2VsZWN0ZWQta2V5cz0ic2VsZWN0ZWRLZXlzIgogICAgICA6cmVuZGVyPSJpdGVtID0+IGl0ZW0udGl0bGUiCiAgICAgIDpkaXNhYmxlZD0iZGlzYWJsZWQiCiAgICAgIEBjaGFuZ2U9ImhhbmRsZUNoYW5nZSIKICAgICAgQHNlbGVjdENoYW5nZT0iaGFuZGxlU2VsZWN0Q2hhbmdlIgogICAgICBAc2Nyb2xsPSJoYW5kbGVTY3JvbGwiCiAgICAvPgogICAgPGEtc3dpdGNoCiAgICAgIHVuLWNoZWNrZWQtY2hpbGRyZW49ImVuYWJsZWQiCiAgICAgIGNoZWNrZWQtY2hpbGRyZW49ImRpc2FibGVkIgogICAgICB2LW1vZGVsOmNoZWNrZWQ9ImRpc2FibGVkIgogICAgICBzdHlsZT0ibWFyZ2luLXRvcDogMTZweCIKICAgIC8+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmludGVyZmFjZSBNb2NrRGF0YSB7CiAga2V5OiBzdHJpbmc7CiAgdGl0bGU6IHN0cmluZzsKICBkZXNjcmlwdGlvbjogc3RyaW5nOwogIGRpc2FibGVkOiBib29sZWFuOwp9CmNvbnN0IG1vY2tEYXRhOiBNb2NrRGF0YVtdID0gW107CmZvciAobGV0IGkgPSAwOyBpIDwgMjA7IGkrKykgewogIG1vY2tEYXRhLnB1c2goewogICAga2V5OiBpLnRvU3RyaW5nKCksCiAgICB0aXRsZTogYGNvbnRlbnQke2kgKyAxfWAsCiAgICBkZXNjcmlwdGlvbjogYGRlc2NyaXB0aW9uIG9mIGNvbnRlbnQke2kgKyAxfWAsCiAgICBkaXNhYmxlZDogaSAlIDMgPCAxLAogIH0pOwp9Cgpjb25zdCBvcmlUYXJnZXRLZXlzID0gbW9ja0RhdGEuZmlsdGVyKGl0ZW0gPT4gK2l0ZW0ua2V5ICUgMyA+IDEpLm1hcChpdGVtID0+IGl0ZW0ua2V5KTsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBkYXRhKCkgewogICAgY29uc3QgZGlzYWJsZWQgPSByZWY8Ym9vbGVhbj4oZmFsc2UpOwoKICAgIGNvbnN0IHRhcmdldEtleXMgPSByZWY8c3RyaW5nW10+KG9yaVRhcmdldEtleXMpOwoKICAgIGNvbnN0IHNlbGVjdGVkS2V5cyA9IHJlZjxzdHJpbmdbXT4oWycxJywgJzQnXSk7CgogICAgY29uc3QgaGFuZGxlQ2hhbmdlID0gKG5leHRUYXJnZXRLZXlzOiBzdHJpbmdbXSwgZGlyZWN0aW9uOiBzdHJpbmcsIG1vdmVLZXlzOiBzdHJpbmdbXSkgPT4gewogICAgICB0YXJnZXRLZXlzLnZhbHVlID0gbmV4dFRhcmdldEtleXM7CiAgICAgIGNvbnNvbGUubG9nKCd0YXJnZXRLZXlzOiAnLCBuZXh0VGFyZ2V0S2V5cyk7CiAgICAgIGNvbnNvbGUubG9nKCdkaXJlY3Rpb246ICcsIGRpcmVjdGlvbik7CiAgICAgIGNvbnNvbGUubG9nKCdtb3ZlS2V5czogJywgbW92ZUtleXMpOwogICAgfTsKICAgIGNvbnN0IGhhbmRsZVNlbGVjdENoYW5nZSA9IChzb3VyY2VTZWxlY3RlZEtleXM6IHN0cmluZ1tdLCB0YXJnZXRTZWxlY3RlZEtleXM6IHN0cmluZ1tdKSA9PiB7CiAgICAgIHNlbGVjdGVkS2V5cy52YWx1ZSA9IFsuLi5zb3VyY2VTZWxlY3RlZEtleXMsIC4uLnRhcmdldFNlbGVjdGVkS2V5c107CiAgICAgIGNvbnNvbGUubG9nKCdzb3VyY2VTZWxlY3RlZEtleXM6ICcsIHNvdXJjZVNlbGVjdGVkS2V5cyk7CiAgICAgIGNvbnNvbGUubG9nKCd0YXJnZXRTZWxlY3RlZEtleXM6ICcsIHRhcmdldFNlbGVjdGVkS2V5cyk7CiAgICB9OwogICAgY29uc3QgaGFuZGxlU2Nyb2xsID0gKGRpcmVjdGlvbjogc3RyaW5nLCBlOiBFdmVudCkgPT4gewogICAgICBjb25zb2xlLmxvZygnZGlyZWN0aW9uOicsIGRpcmVjdGlvbik7CiAgICAgIGNvbnNvbGUubG9nKCd0YXJnZXQ6JywgZS50YXJnZXQpOwogICAgfTsKCiAgICByZXR1cm4gewogICAgICBtb2NrRGF0YSwKICAgICAgdGFyZ2V0S2V5cywKICAgICAgc2VsZWN0ZWRLZXlzLAogICAgICBkaXNhYmxlZCwKICAgICAgaGFuZGxlQ2hhbmdlLAogICAgICBoYW5kbGVTZWxlY3RDaGFuZ2UsCiAgICAgIGhhbmRsZVNjcm9sbCwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS10cmFuc2ZlcgogICAgICA6ZGF0YS1zb3VyY2U9Im1vY2tEYXRhIgogICAgICA6dGl0bGVzPSJbJ1NvdXJjZScsICdUYXJnZXQnXSIKICAgICAgOnRhcmdldC1rZXlzPSJ0YXJnZXRLZXlzIgogICAgICA6c2VsZWN0ZWQta2V5cz0ic2VsZWN0ZWRLZXlzIgogICAgICA6cmVuZGVyPSJpdGVtID0+IGl0ZW0udGl0bGUiCiAgICAgIDpkaXNhYmxlZD0iZGlzYWJsZWQiCiAgICAgIEBjaGFuZ2U9ImhhbmRsZUNoYW5nZSIKICAgICAgQHNlbGVjdENoYW5nZT0iaGFuZGxlU2VsZWN0Q2hhbmdlIgogICAgICBAc2Nyb2xsPSJoYW5kbGVTY3JvbGwiCiAgICAvPgogICAgPGEtc3dpdGNoCiAgICAgIHVuLWNoZWNrZWQtY2hpbGRyZW49ImVuYWJsZWQiCiAgICAgIGNoZWNrZWQtY2hpbGRyZW49ImRpc2FibGVkIgogICAgICB2LW1vZGVsOmNoZWNrZWQ9ImRpc2FibGVkIgogICAgICBzdHlsZT0ibWFyZ2luLXRvcDogMTZweCIKICAgIC8+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKY29uc3QgbW9ja0RhdGEgPSBbXTsKZm9yIChsZXQgaSA9IDA7IGkgPCAyMDsgaSsrKSB7CiAgbW9ja0RhdGEucHVzaCh7CiAgICBrZXk6IGkudG9TdHJpbmcoKSwKICAgIHRpdGxlOiBgY29udGVudCR7aSArIDF9YCwKICAgIGRlc2NyaXB0aW9uOiBgZGVzY3JpcHRpb24gb2YgY29udGVudCR7aSArIDF9YCwKICAgIGRpc2FibGVkOiBpICUgMyA8IDEsCiAgfSk7Cn0KY29uc3Qgb3JpVGFyZ2V0S2V5cyA9IG1vY2tEYXRhLmZpbHRlcihpdGVtID0+ICtpdGVtLmtleSAlIDMgPiAxKS5tYXAoaXRlbSA9PiBpdGVtLmtleSk7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgZGF0YSgpIHsKICAgIGNvbnN0IGRpc2FibGVkID0gcmVmKGZhbHNlKTsKICAgIGNvbnN0IHRhcmdldEtleXMgPSByZWYob3JpVGFyZ2V0S2V5cyk7CiAgICBjb25zdCBzZWxlY3RlZEtleXMgPSByZWYoWycxJywgJzQnXSk7CiAgICBjb25zdCBoYW5kbGVDaGFuZ2UgPSAobmV4dFRhcmdldEtleXMsIGRpcmVjdGlvbiwgbW92ZUtleXMpID0+IHsKICAgICAgdGFyZ2V0S2V5cy52YWx1ZSA9IG5leHRUYXJnZXRLZXlzOwogICAgICBjb25zb2xlLmxvZygndGFyZ2V0S2V5czogJywgbmV4dFRhcmdldEtleXMpOwogICAgICBjb25zb2xlLmxvZygnZGlyZWN0aW9uOiAnLCBkaXJlY3Rpb24pOwogICAgICBjb25zb2xlLmxvZygnbW92ZUtleXM6ICcsIG1vdmVLZXlzKTsKICAgIH07CiAgICBjb25zdCBoYW5kbGVTZWxlY3RDaGFuZ2UgPSAoc291cmNlU2VsZWN0ZWRLZXlzLCB0YXJnZXRTZWxlY3RlZEtleXMpID0+IHsKICAgICAgc2VsZWN0ZWRLZXlzLnZhbHVlID0gWy4uLnNvdXJjZVNlbGVjdGVkS2V5cywgLi4udGFyZ2V0U2VsZWN0ZWRLZXlzXTsKICAgICAgY29uc29sZS5sb2coJ3NvdXJjZVNlbGVjdGVkS2V5czogJywgc291cmNlU2VsZWN0ZWRLZXlzKTsKICAgICAgY29uc29sZS5sb2coJ3RhcmdldFNlbGVjdGVkS2V5czogJywgdGFyZ2V0U2VsZWN0ZWRLZXlzKTsKICAgIH07CiAgICBjb25zdCBoYW5kbGVTY3JvbGwgPSAoZGlyZWN0aW9uLCBlKSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKCdkaXJlY3Rpb246JywgZGlyZWN0aW9uKTsKICAgICAgY29uc29sZS5sb2coJ3RhcmdldDonLCBlLnRhcmdldCk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgbW9ja0RhdGEsCiAgICAgIHRhcmdldEtleXMsCiAgICAgIHNlbGVjdGVkS2V5cywKICAgICAgZGlzYWJsZWQsCiAgICAgIGhhbmRsZUNoYW5nZSwKICAgICAgaGFuZGxlU2VsZWN0Q2hhbmdlLAogICAgICBoYW5kbGVTY3JvbGwsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:k(()=>[n("div",null,[C(o,{"data-source":s.mockData,titles:["Source","Target"],"target-keys":s.targetKeys,"selected-keys":s.selectedKeys,render:i=>i.title,disabled:s.disabled,onChange:s.handleChange,onSelectChange:s.handleSelectChange,onScroll:s.handleScroll},null,8,["data-source","target-keys","selected-keys","render","disabled","onChange","onSelectChange","onScroll"]),C(e,{"un-checked-children":"enabled","checked-children":"disabled",checked:s.disabled,"onUpdate:checked":a[0]||(a[0]=i=>s.disabled=i),style:{"margin-top":"16px"}},null,8,["checked"])])]),htmlCode:k(()=>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(`
    6. 

  6.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    7. 

  7.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    8. 

  8.       `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("mockData"),n("span",{class:"token punctuation"},'"')]),t(`
    9. 

  9.       `),n("span",{class:"token attr-name"},":titles"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("['Source', 'Target']"),n("span",{class:"token punctuation"},'"')]),t(`
    10. 

  10.       `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    11. 

  11.       `),n("span",{class:"token attr-name"},":selected-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("selectedKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    12. 

  12.       `),n("span",{class:"token attr-name"},":render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("item => item.title"),n("span",{class:"token punctuation"},'"')]),t(`
    13. 

  13.       `),n("span",{class:"token attr-name"},":disabled"),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(`
    14. 

  14.       `),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(`
    15. 

  15.       `),n("span",{class:"token attr-name"},"@selectChange"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleSelectChange"),n("span",{class:"token punctuation"},'"')]),t(`
    16. 

  16.       `),n("span",{class:"token attr-name"},"@scroll"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleScroll"),n("span",{class:"token punctuation"},'"')]),t(`
    17. 

  17.     `),n("span",{class:"token punctuation"},"/>")]),t(`
    18. 

  18.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-switch")]),t(`
    19. 

  19.       `),n("span",{class:"token attr-name"},"un-checked-children"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("enabled"),n("span",{class:"token punctuation"},'"')]),t(`
    20. 

  20.       `),n("span",{class:"token attr-name"},"checked-children"),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(`
    21. 

  21.       `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("checked")]),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(`
    22. 

  22.       `),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(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(`
    23. 

  23.     `),n("span",{class:"token punctuation"},"/>")]),t(`
    24. 

  24.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    25. 

  25. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    26. 

  26. `),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(`
    27. 

  27. `),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(`
    28. 

  28. `),n("span",{class:"token keyword"},"interface"),t(),n("span",{class:"token class-name"},"MockData"),t(),n("span",{class:"token punctuation"},"{"),t(`
    29. 

  29.   `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    30. 

  30.   `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    31. 

  31.   `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    32. 

  32.   `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(" boolean"),n("span",{class:"token punctuation"},";"),t(`
    33. 

  33. `),n("span",{class:"token punctuation"},"}"),t(`
    34. 

  34. `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token literal-property property"},"mockData"),n("span",{class:"token operator"},":"),t(" MockData"),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(`
    35. 

  35. `),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"},"20"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    36. 

  36.   mockData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
    37. 

  37.     `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    38. 

  38.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    39. 

  39.     `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"description of content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    40. 

  40.     `),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"},"3"),t(),n("span",{class:"token operator"},"<"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},","),t(`
    41. 

  41.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    42. 

  42. `),n("span",{class:"token punctuation"},"}"),t(`
    43. 

  43. 

  44. `),n("span",{class:"token keyword"},"const"),t(" oriTargetKeys "),n("span",{class:"token operator"},"="),t(" mockData"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token operator"},"+"),t("item"),n("span",{class:"token punctuation"},"."),t("key "),n("span",{class:"token operator"},"%"),t(),n("span",{class:"token number"},"3"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"1"),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 parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(" item"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    45. 

  45. `),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(`
    46. 

  46.   `),n("span",{class:"token function"},"data"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    47. 

  47.     `),n("span",{class:"token keyword"},"const"),t(" disabled "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    48. 

  48. 

  49.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),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"},"("),t("oriTargetKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    50. 

  50. 

  51.     `),n("span",{class:"token keyword"},"const"),t(" selectedKeys "),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 string"},"'1'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'4'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    52. 

  52. 

  53.     `),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"},"nextTargetKeys"),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 literal-property property"},"direction"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"moveKeys"),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(`
    54. 

  54.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" nextTargetKeys"),n("span",{class:"token punctuation"},";"),t(`
    55. 

  55.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'targetKeys: '"),n("span",{class:"token punctuation"},","),t(" nextTargetKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    56. 

  56.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'direction: '"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    57. 

  57.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'moveKeys: '"),n("span",{class:"token punctuation"},","),t(" moveKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    58. 

  58.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    59. 

  59.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleSelectChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"sourceSelectedKeys"),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 literal-property property"},"targetSelectedKeys"),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(`
    60. 

  60.       selectedKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token operator"},"..."),t("sourceSelectedKeys"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token operator"},"..."),t("targetSelectedKeys"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    61. 

  61.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'sourceSelectedKeys: '"),n("span",{class:"token punctuation"},","),t(" sourceSelectedKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    62. 

  62.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'targetSelectedKeys: '"),n("span",{class:"token punctuation"},","),t(" targetSelectedKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    63. 

  63.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    64. 

  64.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleScroll"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"direction"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"e"),n("span",{class:"token operator"},":"),t(" Event")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    65. 

  65.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'direction:'"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    66. 

  66.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'target:'"),n("span",{class:"token punctuation"},","),t(" e"),n("span",{class:"token punctuation"},"."),t("target"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    67. 

  67.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    68. 

  68. 

  69.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    70. 

  70.       mockData`),n("span",{class:"token punctuation"},","),t(`
    71. 

  71.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    72. 

  72.       selectedKeys`),n("span",{class:"token punctuation"},","),t(`
    73. 

  73.       disabled`),n("span",{class:"token punctuation"},","),t(`
    74. 

  74.       handleChange`),n("span",{class:"token punctuation"},","),t(`
    75. 

  75.       handleSelectChange`),n("span",{class:"token punctuation"},","),t(`
    76. 

  76.       handleScroll`),n("span",{class:"token punctuation"},","),t(`
    77. 

  77.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    78. 

  78.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    79. 

  79. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    80. 

  80. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    81. 

  81. `)])],-1)])),jsVersionHtml:k(()=>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(`
    82. 

  82.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    83. 

  83.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    84. 

  84.       `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("mockData"),n("span",{class:"token punctuation"},'"')]),t(`
    85. 

  85.       `),n("span",{class:"token attr-name"},":titles"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("['Source', 'Target']"),n("span",{class:"token punctuation"},'"')]),t(`
    86. 

  86.       `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    87. 

  87.       `),n("span",{class:"token attr-name"},":selected-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("selectedKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    88. 

  88.       `),n("span",{class:"token attr-name"},":render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("item => item.title"),n("span",{class:"token punctuation"},'"')]),t(`
    89. 

  89.       `),n("span",{class:"token attr-name"},":disabled"),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(`
    90. 

  90.       `),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(`
    91. 

  91.       `),n("span",{class:"token attr-name"},"@selectChange"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleSelectChange"),n("span",{class:"token punctuation"},'"')]),t(`
    92. 

  92.       `),n("span",{class:"token attr-name"},"@scroll"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleScroll"),n("span",{class:"token punctuation"},'"')]),t(`
    93. 

  93.     `),n("span",{class:"token punctuation"},"/>")]),t(`
    94. 

  94.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-switch")]),t(`
    95. 

  95.       `),n("span",{class:"token attr-name"},"un-checked-children"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("enabled"),n("span",{class:"token punctuation"},'"')]),t(`
    96. 

  96.       `),n("span",{class:"token attr-name"},"checked-children"),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(`
    97. 

  97.       `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("checked")]),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(`
    98. 

  98.       `),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(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(`
    99. 

  99.     `),n("span",{class:"token punctuation"},"/>")]),t(`
    100. 

  100.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    101. 

  101. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    102. 

  102. `),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(`
    103. 

  103. `),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(`
    104. 

  104. `),n("span",{class:"token keyword"},"const"),t(" mockData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    105. 

  105. `),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"},"20"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    106. 

  106.   mockData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
    107. 

  107.     `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    108. 

  108.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    109. 

  109.     `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"description of content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    110. 

  110.     `),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"},"3"),t(),n("span",{class:"token operator"},"<"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},","),t(`
    111. 

  111.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    112. 

  112. `),n("span",{class:"token punctuation"},"}"),t(`
    113. 

  113. `),n("span",{class:"token keyword"},"const"),t(" oriTargetKeys "),n("span",{class:"token operator"},"="),t(" mockData"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token operator"},"+"),t("item"),n("span",{class:"token punctuation"},"."),t("key "),n("span",{class:"token operator"},"%"),t(),n("span",{class:"token number"},"3"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"1"),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 parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(" item"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    114. 

  114. `),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(`
    115. 

  115.   `),n("span",{class:"token function"},"data"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    116. 

  116.     `),n("span",{class:"token keyword"},"const"),t(" disabled "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    117. 

  117.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),t("oriTargetKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    118. 

  118.     `),n("span",{class:"token keyword"},"const"),t(" selectedKeys "),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"},"'1'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'4'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    119. 

  119.     `),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"},[t("nextTargetKeys"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},","),t(" moveKeys")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    120. 

  120.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" nextTargetKeys"),n("span",{class:"token punctuation"},";"),t(`
    121. 

  121.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'targetKeys: '"),n("span",{class:"token punctuation"},","),t(" nextTargetKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    122. 

  122.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'direction: '"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    123. 

  123.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'moveKeys: '"),n("span",{class:"token punctuation"},","),t(" moveKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    124. 

  124.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    125. 

  125.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleSelectChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("sourceSelectedKeys"),n("span",{class:"token punctuation"},","),t(" targetSelectedKeys")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    126. 

  126.       selectedKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token operator"},"..."),t("sourceSelectedKeys"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token operator"},"..."),t("targetSelectedKeys"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    127. 

  127.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'sourceSelectedKeys: '"),n("span",{class:"token punctuation"},","),t(" sourceSelectedKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    128. 

  128.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'targetSelectedKeys: '"),n("span",{class:"token punctuation"},","),t(" targetSelectedKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    129. 

  129.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    130. 

  130.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleScroll"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("direction"),n("span",{class:"token punctuation"},","),t(" e")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    131. 

  131.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'direction:'"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    132. 

  132.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'target:'"),n("span",{class:"token punctuation"},","),t(" e"),n("span",{class:"token punctuation"},"."),t("target"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    133. 

  133.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    134. 

  134.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    135. 

  135.       mockData`),n("span",{class:"token punctuation"},","),t(`
    136. 

  136.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    137. 

  137.       selectedKeys`),n("span",{class:"token punctuation"},","),t(`
    138. 

  138.       disabled`),n("span",{class:"token punctuation"},","),t(`
    139. 

  139.       handleChange`),n("span",{class:"token punctuation"},","),t(`
    140. 

  140.       handleSelectChange`),n("span",{class:"token punctuation"},","),t(`
    141. 

  141.       handleScroll`),n("span",{class:"token punctuation"},","),t(`
    142. 

  142.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    143. 

  143.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    144. 

  144. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    145. 

  145. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    146. 

  146. `)])],-1)])),_:1})}var an=b(tn,[["render",sn]]);const on=G({setup(){const s=A([]),a=A([]);K(()=>{p()});const p=()=>{const o=[],e=[];for(let c=0;c<20;c++){const i={key:c.toString(),title:`content${c+1}`,description:`description of content${c+1}`,chosen:Math.random()*2>1};i.chosen&&o.push(i.key),e.push(i)}s.value=e,a.value=o};return{mockData:s,targetKeys:a,filterOption:(o,e)=>e.description.indexOf(o)>-1,handleChange:(o,e,c)=>{console.log(o,e,c),a.value=o},handleSearch:(o,e)=>{console.log("search:",o,e)}}}});function en(s,a,p,I,l,u){const o=r("a-transfer"),e=r("demo-box");return h(),Z(e,{jsfiddle:{us:"Transfer with a search box.",cn:"\u5E26\u641C\u7D22\u6846\u7684\u7A7F\u68AD\u6846\uFF0C\u53EF\u4EE5\u81EA\u5B9A\u4E49\u641C\u7D22\u51FD\u6570\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
    147. 

  147. <p>\u5E26\u641C\u7D22\u6846\u7684\u7A7F\u68AD\u6846\uFF0C\u53EF\u4EE5\u81EA\u5B9A\u4E49\u641C\u7D22\u51FD\u6570\u3002</p>
    148. 

  148. <h2 id="en-us">en-US</h2>
    149. 

  149. <p>Transfer with a search box.</p>
    150. 

  150. `,order:1,title:{"zh-CN":"\u5E26\u641C\u7D22\u6846","en-US":"Search"},relativePath:"src/docs/transfer/demo/search.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRyYW5zZmVyCiAgICA6ZGF0YS1zb3VyY2U9Im1vY2tEYXRhIgogICAgc2hvdy1zZWFyY2gKICAgIDpmaWx0ZXItb3B0aW9uPSJmaWx0ZXJPcHRpb24iCiAgICA6dGFyZ2V0LWtleXM9InRhcmdldEtleXMiCiAgICA6cmVuZGVyPSJpdGVtID0+IGl0ZW0udGl0bGUiCiAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgICBAc2VhcmNoPSJoYW5kbGVTZWFyY2giCiAgLz4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgb25Nb3VudGVkLCByZWYgfSBmcm9tICd2dWUnOwppbnRlcmZhY2UgTW9ja0RhdGEgewogIGtleTogc3RyaW5nOwogIHRpdGxlOiBzdHJpbmc7CiAgZGVzY3JpcHRpb246IHN0cmluZzsKICBjaG9zZW46IGJvb2xlYW47Cn0KZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IG1vY2tEYXRhID0gcmVmPE1vY2tEYXRhW10+KFtdKTsKCiAgICBjb25zdCB0YXJnZXRLZXlzID0gcmVmPHN0cmluZ1tdPihbXSk7CiAgICBvbk1vdW50ZWQoKCkgPT4gewogICAgICBnZXRNb2NrKCk7CiAgICB9KTsKICAgIGNvbnN0IGdldE1vY2sgPSAoKSA9PiB7CiAgICAgIGNvbnN0IGtleXMgPSBbXTsKICAgICAgY29uc3QgbURhdGEgPSBbXTsKICAgICAgZm9yIChsZXQgaSA9IDA7IGkgPCAyMDsgaSsrKSB7CiAgICAgICAgY29uc3QgZGF0YSA9IHsKICAgICAgICAgIGtleTogaS50b1N0cmluZygpLAogICAgICAgICAgdGl0bGU6IGBjb250ZW50JHtpICsgMX1gLAogICAgICAgICAgZGVzY3JpcHRpb246IGBkZXNjcmlwdGlvbiBvZiBjb250ZW50JHtpICsgMX1gLAogICAgICAgICAgY2hvc2VuOiBNYXRoLnJhbmRvbSgpICogMiA+IDEsCiAgICAgICAgfTsKICAgICAgICBpZiAoZGF0YS5jaG9zZW4pIHsKICAgICAgICAgIGtleXMucHVzaChkYXRhLmtleSk7CiAgICAgICAgfQogICAgICAgIG1EYXRhLnB1c2goZGF0YSk7CiAgICAgIH0KICAgICAgbW9ja0RhdGEudmFsdWUgPSBtRGF0YTsKICAgICAgdGFyZ2V0S2V5cy52YWx1ZSA9IGtleXM7CiAgICB9OwogICAgY29uc3QgZmlsdGVyT3B0aW9uID0gKGlucHV0VmFsdWU6IHN0cmluZywgb3B0aW9uOiBNb2NrRGF0YSkgPT4gewogICAgICByZXR1cm4gb3B0aW9uLmRlc2NyaXB0aW9uLmluZGV4T2YoaW5wdXRWYWx1ZSkgPiAtMTsKICAgIH07CiAgICBjb25zdCBoYW5kbGVDaGFuZ2UgPSAoa2V5czogc3RyaW5nW10sIGRpcmVjdGlvbjogc3RyaW5nLCBtb3ZlS2V5czogc3RyaW5nW10pID0+IHsKICAgICAgY29uc29sZS5sb2coa2V5cywgZGlyZWN0aW9uLCBtb3ZlS2V5cyk7CiAgICAgIHRhcmdldEtleXMudmFsdWUgPSBrZXlzOwogICAgfTsKCiAgICBjb25zdCBoYW5kbGVTZWFyY2ggPSAoZGlyOiBzdHJpbmcsIHZhbHVlOiBzdHJpbmcpID0+IHsKICAgICAgY29uc29sZS5sb2coJ3NlYXJjaDonLCBkaXIsIHZhbHVlKTsKICAgIH07CiAgICByZXR1cm4gewogICAgICBtb2NrRGF0YSwKICAgICAgdGFyZ2V0S2V5cywKICAgICAgZmlsdGVyT3B0aW9uLAogICAgICBoYW5kbGVDaGFuZ2UsCiAgICAgIGhhbmRsZVNlYXJjaCwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRyYW5zZmVyCiAgICA6ZGF0YS1zb3VyY2U9Im1vY2tEYXRhIgogICAgc2hvdy1zZWFyY2gKICAgIDpmaWx0ZXItb3B0aW9uPSJmaWx0ZXJPcHRpb24iCiAgICA6dGFyZ2V0LWtleXM9InRhcmdldEtleXMiCiAgICA6cmVuZGVyPSJpdGVtID0+IGl0ZW0udGl0bGUiCiAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgICBAc2VhcmNoPSJoYW5kbGVTZWFyY2giCiAgLz4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCBvbk1vdW50ZWQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBtb2NrRGF0YSA9IHJlZihbXSk7CiAgICBjb25zdCB0YXJnZXRLZXlzID0gcmVmKFtdKTsKICAgIG9uTW91bnRlZCgoKSA9PiB7CiAgICAgIGdldE1vY2soKTsKICAgIH0pOwogICAgY29uc3QgZ2V0TW9jayA9ICgpID0+IHsKICAgICAgY29uc3Qga2V5cyA9IFtdOwogICAgICBjb25zdCBtRGF0YSA9IFtdOwogICAgICBmb3IgKGxldCBpID0gMDsgaSA8IDIwOyBpKyspIHsKICAgICAgICBjb25zdCBkYXRhID0gewogICAgICAgICAga2V5OiBpLnRvU3RyaW5nKCksCiAgICAgICAgICB0aXRsZTogYGNvbnRlbnQke2kgKyAxfWAsCiAgICAgICAgICBkZXNjcmlwdGlvbjogYGRlc2NyaXB0aW9uIG9mIGNvbnRlbnQke2kgKyAxfWAsCiAgICAgICAgICBjaG9zZW46IE1hdGgucmFuZG9tKCkgKiAyID4gMSwKICAgICAgICB9OwogICAgICAgIGlmIChkYXRhLmNob3NlbikgewogICAgICAgICAga2V5cy5wdXNoKGRhdGEua2V5KTsKICAgICAgICB9CiAgICAgICAgbURhdGEucHVzaChkYXRhKTsKICAgICAgfQogICAgICBtb2NrRGF0YS52YWx1ZSA9IG1EYXRhOwogICAgICB0YXJnZXRLZXlzLnZhbHVlID0ga2V5czsKICAgIH07CiAgICBjb25zdCBmaWx0ZXJPcHRpb24gPSAoaW5wdXRWYWx1ZSwgb3B0aW9uKSA9PiB7CiAgICAgIHJldHVybiBvcHRpb24uZGVzY3JpcHRpb24uaW5kZXhPZihpbnB1dFZhbHVlKSA+IC0xOwogICAgfTsKICAgIGNvbnN0IGhhbmRsZUNoYW5nZSA9IChrZXlzLCBkaXJlY3Rpb24sIG1vdmVLZXlzKSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKGtleXMsIGRpcmVjdGlvbiwgbW92ZUtleXMpOwogICAgICB0YXJnZXRLZXlzLnZhbHVlID0ga2V5czsKICAgIH07CiAgICBjb25zdCBoYW5kbGVTZWFyY2ggPSAoZGlyLCB2YWx1ZSkgPT4gewogICAgICBjb25zb2xlLmxvZygnc2VhcmNoOicsIGRpciwgdmFsdWUpOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIG1vY2tEYXRhLAogICAgICB0YXJnZXRLZXlzLAogICAgICBmaWx0ZXJPcHRpb24sCiAgICAgIGhhbmRsZUNoYW5nZSwKICAgICAgaGFuZGxlU2VhcmNoLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:k(()=>[C(o,{"data-source":s.mockData,"show-search":"","filter-option":s.filterOption,"target-keys":s.targetKeys,render:c=>c.title,onChange:s.handleChange,onSearch:s.handleSearch},null,8,["data-source","filter-option","target-keys","render","onChange","onSearch"])]),htmlCode:k(()=>a[0]||(a[0]=[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(`
    151. 

  151.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    152. 

  152.     `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("mockData"),n("span",{class:"token punctuation"},'"')]),t(`
    153. 

  153.     `),n("span",{class:"token attr-name"},"show-search"),t(`
    154. 

  154.     `),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("filterOption"),n("span",{class:"token punctuation"},'"')]),t(`
    155. 

  155.     `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    156. 

  156.     `),n("span",{class:"token attr-name"},":render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("item => item.title"),n("span",{class:"token punctuation"},'"')]),t(`
    157. 

  157.     `),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(`
    158. 

  158.     `),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(`
    159. 

  159.   `),n("span",{class:"token punctuation"},"/>")]),t(`
    160. 

  160. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    161. 

  161. `),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(`
    162. 

  162. `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" onMounted"),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(`
    163. 

  163. `),n("span",{class:"token keyword"},"interface"),t(),n("span",{class:"token class-name"},"MockData"),t(),n("span",{class:"token punctuation"},"{"),t(`
    164. 

  164.   `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    165. 

  165.   `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    166. 

  166.   `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    167. 

  167.   `),n("span",{class:"token literal-property property"},"chosen"),n("span",{class:"token operator"},":"),t(" boolean"),n("span",{class:"token punctuation"},";"),t(`
    168. 

  168. `),n("span",{class:"token punctuation"},"}"),t(`
    169. 

  169. `),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(`
    170. 

  170.   `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    171. 

  171.     `),n("span",{class:"token keyword"},"const"),t(" mockData "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("MockData"),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(`
    172. 

  172. 

  173.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),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(`
    174. 

  174.     `),n("span",{class:"token function"},"onMounted"),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(`
    175. 

  175.       `),n("span",{class:"token function"},"getMock"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    176. 

  176.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    177. 

  177.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"getMock"),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(`
    178. 

  178.       `),n("span",{class:"token keyword"},"const"),t(" keys "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    179. 

  179.       `),n("span",{class:"token keyword"},"const"),t(" mData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    180. 

  180.       `),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"},"20"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    181. 

  181.         `),n("span",{class:"token keyword"},"const"),t(" data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"{"),t(`
    182. 

  182.           `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    183. 

  183.           `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    184. 

  184.           `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"description of content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    185. 

  185.           `),n("span",{class:"token literal-property property"},"chosen"),n("span",{class:"token operator"},":"),t(" Math"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"random"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"*"),t(),n("span",{class:"token number"},"2"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},","),t(`
    186. 

  186.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    187. 

  187.         `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("chosen"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    188. 

  188.           keys`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    189. 

  189.         `),n("span",{class:"token punctuation"},"}"),t(`
    190. 

  190.         mData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    191. 

  191.       `),n("span",{class:"token punctuation"},"}"),t(`
    192. 

  192.       mockData`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" mData"),n("span",{class:"token punctuation"},";"),t(`
    193. 

  193.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    194. 

  194.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    195. 

  195.     `),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"},"inputValue"),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(" MockData")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    196. 

  196.       `),n("span",{class:"token keyword"},"return"),t(" option"),n("span",{class:"token punctuation"},"."),t("description"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"indexOf"),n("span",{class:"token punctuation"},"("),t("inputValue"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token operator"},"-"),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),t(`
    197. 

  197.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    198. 

  198.     `),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"},"keys"),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 literal-property property"},"direction"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"moveKeys"),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(`
    199. 

  199.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("keys"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},","),t(" moveKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    200. 

  200.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    201. 

  201.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    202. 

  202. 

  203.     `),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"},"dir"),n("span",{class:"token operator"},":"),t(" string"),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(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    204. 

  204.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'search:'"),n("span",{class:"token punctuation"},","),t(" dir"),n("span",{class:"token punctuation"},","),t(" value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    205. 

  205.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    206. 

  206.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    207. 

  207.       mockData`),n("span",{class:"token punctuation"},","),t(`
    208. 

  208.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    209. 

  209.       filterOption`),n("span",{class:"token punctuation"},","),t(`
    210. 

  210.       handleChange`),n("span",{class:"token punctuation"},","),t(`
    211. 

  211.       handleSearch`),n("span",{class:"token punctuation"},","),t(`
    212. 

  212.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    213. 

  213.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    214. 

  214. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    215. 

  215. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    216. 

  216. `)])],-1)])),jsVersionHtml:k(()=>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(`
    217. 

  217.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    218. 

  218.     `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("mockData"),n("span",{class:"token punctuation"},'"')]),t(`
    219. 

  219.     `),n("span",{class:"token attr-name"},"show-search"),t(`
    220. 

  220.     `),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("filterOption"),n("span",{class:"token punctuation"},'"')]),t(`
    221. 

  221.     `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    222. 

  222.     `),n("span",{class:"token attr-name"},":render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("item => item.title"),n("span",{class:"token punctuation"},'"')]),t(`
    223. 

  223.     `),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(`
    224. 

  224.     `),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(`
    225. 

  225.   `),n("span",{class:"token punctuation"},"/>")]),t(`
    226. 

  226. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    227. 

  227. `),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(`
    228. 

  228. `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" onMounted"),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(`
    229. 

  229. `),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(`
    230. 

  230.   `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    231. 

  231.     `),n("span",{class:"token keyword"},"const"),t(" mockData "),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(`
    232. 

  232.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),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(`
    233. 

  233.     `),n("span",{class:"token function"},"onMounted"),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(`
    234. 

  234.       `),n("span",{class:"token function"},"getMock"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    235. 

  235.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    236. 

  236.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"getMock"),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(`
    237. 

  237.       `),n("span",{class:"token keyword"},"const"),t(" keys "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    238. 

  238.       `),n("span",{class:"token keyword"},"const"),t(" mData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    239. 

  239.       `),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"},"20"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    240. 

  240.         `),n("span",{class:"token keyword"},"const"),t(" data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"{"),t(`
    241. 

  241.           `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    242. 

  242.           `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    243. 

  243.           `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"description of content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    244. 

  244.           `),n("span",{class:"token literal-property property"},"chosen"),n("span",{class:"token operator"},":"),t(" Math"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"random"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"*"),t(),n("span",{class:"token number"},"2"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},","),t(`
    245. 

  245.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    246. 

  246.         `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("chosen"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    247. 

  247.           keys`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    248. 

  248.         `),n("span",{class:"token punctuation"},"}"),t(`
    249. 

  249.         mData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    250. 

  250.       `),n("span",{class:"token punctuation"},"}"),t(`
    251. 

  251.       mockData`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" mData"),n("span",{class:"token punctuation"},";"),t(`
    252. 

  252.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    253. 

  253.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    254. 

  254.     `),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("inputValue"),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(`
    255. 

  255.       `),n("span",{class:"token keyword"},"return"),t(" option"),n("span",{class:"token punctuation"},"."),t("description"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"indexOf"),n("span",{class:"token punctuation"},"("),t("inputValue"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token operator"},"-"),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),t(`
    256. 

  256.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    257. 

  257.     `),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"},[t("keys"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},","),t(" moveKeys")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    258. 

  258.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("keys"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},","),t(" moveKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    259. 

  259.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    260. 

  260.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    261. 

  261.     `),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"},[t("dir"),n("span",{class:"token punctuation"},","),t(" value")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    262. 

  262.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'search:'"),n("span",{class:"token punctuation"},","),t(" dir"),n("span",{class:"token punctuation"},","),t(" value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    263. 

  263.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    264. 

  264.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    265. 

  265.       mockData`),n("span",{class:"token punctuation"},","),t(`
    266. 

  266.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    267. 

  267.       filterOption`),n("span",{class:"token punctuation"},","),t(`
    268. 

  268.       handleChange`),n("span",{class:"token punctuation"},","),t(`
    269. 

  269.       handleSearch`),n("span",{class:"token punctuation"},","),t(`
    270. 

  270.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    271. 

  271.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    272. 

  272. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    273. 

  273. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    274. 

  274. `)])],-1)])),_:1})}var cn=b(on,[["render",en]]);const pn=G({setup(){const s=A([]),a=A([]);K(()=>{p()});const p=()=>{const l=[],u=[];for(let o=0;o<20;o++){const e={key:o.toString(),title:`content${o+1}`,description:`description of content${o+1}`,chosen:Math.random()*2>1};e.chosen&&l.push(e.key),u.push(e)}s.value=u,a.value=l};return{mockData:s,targetKeys:a,handleChange:(l,u,o)=>{a.value=l,console.log(l,u,o)},getMock:p}}});function ln(s,a,p,I,l,u){const o=r("a-button"),e=r("a-transfer"),c=r("demo-box");return h(),Z(c,{jsfiddle:{us:"You can customize the labels of the transfer buttons, the width and height of the columns, and what should be displayed in the footer.",cn:"\u7A7F\u68AD\u6846\u9AD8\u7EA7\u7528\u6CD5\uFF0C\u53EF\u914D\u7F6E\u64CD\u4F5C\u6587\u6848\uFF0C\u53EF\u5B9A\u5236\u5BBD\u9AD8\uFF0C\u53EF\u5BF9\u5E95\u90E8\u8FDB\u884C\u81EA\u5B9A\u4E49\u6E32\u67D3\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
    275. 

  275. <p>\u7A7F\u68AD\u6846\u9AD8\u7EA7\u7528\u6CD5\uFF0C\u53EF\u914D\u7F6E\u64CD\u4F5C\u6587\u6848\uFF0C\u53EF\u5B9A\u5236\u5BBD\u9AD8\uFF0C\u53EF\u5BF9\u5E95\u90E8\u8FDB\u884C\u81EA\u5B9A\u4E49\u6E32\u67D3\u3002</p>
    276. 

  276. <h2 id="en-us">en-US</h2>
    277. 

  277. <p>You can customize the labels of the transfer buttons, the width and height of the columns, and what should be displayed in the footer.</p>
    278. 

  278. `,order:2,title:{"zh-CN":"\u9AD8\u7EA7\u7528\u6CD5","en-US":"Advanced"},relativePath:"src/docs/transfer/demo/advanced.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRyYW5zZmVyCiAgICA6ZGF0YS1zb3VyY2U9Im1vY2tEYXRhIgogICAgc2hvdy1zZWFyY2gKICAgIDpsaXN0LXN0eWxlPSJ7CiAgICAgIHdpZHRoOiAnMjUwcHgnLAogICAgICBoZWlnaHQ6ICczMDBweCcsCiAgICB9IgogICAgOm9wZXJhdGlvbnM9IlsndG8gcmlnaHQnLCAndG8gbGVmdCddIgogICAgOnRhcmdldC1rZXlzPSJ0YXJnZXRLZXlzIgogICAgOnJlbmRlcj0iaXRlbSA9PiBgJHtpdGVtLnRpdGxlfS0ke2l0ZW0uZGVzY3JpcHRpb259YCIKICAgIEBjaGFuZ2U9ImhhbmRsZUNoYW5nZSIKICA+CiAgICA8dGVtcGxhdGUgI2Zvb3Rlcj4KICAgICAgPGEtYnV0dG9uIHNpemU9InNtYWxsIiBzdHlsZT0iZmxvYXQ6IHJpZ2h0OyBtYXJnaW46IDVweCIgQGNsaWNrPSJnZXRNb2NrIj5yZWxvYWQ8L2EtYnV0dG9uPgogICAgPC90ZW1wbGF0ZT4KICAgIDx0ZW1wbGF0ZSAjbm90Rm91bmRDb250ZW50PgogICAgICA8c3Bhbj7msqHmlbDmja48L3NwYW4+CiAgICA8L3RlbXBsYXRlPgogIDwvYS10cmFuc2Zlcj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmLCBvbk1vdW50ZWQgfSBmcm9tICd2dWUnOwppbnRlcmZhY2UgTW9ja0RhdGEgewogIGtleTogc3RyaW5nOwogIHRpdGxlOiBzdHJpbmc7CiAgZGVzY3JpcHRpb246IHN0cmluZzsKICBjaG9zZW46IGJvb2xlYW47Cn0KZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IG1vY2tEYXRhID0gcmVmPE1vY2tEYXRhW10+KFtdKTsKCiAgICBjb25zdCB0YXJnZXRLZXlzID0gcmVmPHN0cmluZ1tdPihbXSk7CiAgICBvbk1vdW50ZWQoKCkgPT4gewogICAgICBnZXRNb2NrKCk7CiAgICB9KTsKICAgIGNvbnN0IGdldE1vY2sgPSAoKSA9PiB7CiAgICAgIGNvbnN0IGtleXMgPSBbXTsKICAgICAgY29uc3QgbURhdGEgPSBbXTsKICAgICAgZm9yIChsZXQgaSA9IDA7IGkgPCAyMDsgaSsrKSB7CiAgICAgICAgY29uc3QgZGF0YSA9IHsKICAgICAgICAgIGtleTogaS50b1N0cmluZygpLAogICAgICAgICAgdGl0bGU6IGBjb250ZW50JHtpICsgMX1gLAogICAgICAgICAgZGVzY3JpcHRpb246IGBkZXNjcmlwdGlvbiBvZiBjb250ZW50JHtpICsgMX1gLAogICAgICAgICAgY2hvc2VuOiBNYXRoLnJhbmRvbSgpICogMiA+IDEsCiAgICAgICAgfTsKICAgICAgICBpZiAoZGF0YS5jaG9zZW4pIHsKICAgICAgICAgIGtleXMucHVzaChkYXRhLmtleSk7CiAgICAgICAgfQogICAgICAgIG1EYXRhLnB1c2goZGF0YSk7CiAgICAgIH0KICAgICAgbW9ja0RhdGEudmFsdWUgPSBtRGF0YTsKICAgICAgdGFyZ2V0S2V5cy52YWx1ZSA9IGtleXM7CiAgICB9OwogICAgY29uc3QgaGFuZGxlQ2hhbmdlID0gKGtleXM6IHN0cmluZ1tdLCBkaXJlY3Rpb246IHN0cmluZywgbW92ZUtleXM6IHN0cmluZ1tdKSA9PiB7CiAgICAgIHRhcmdldEtleXMudmFsdWUgPSBrZXlzOwogICAgICBjb25zb2xlLmxvZyhrZXlzLCBkaXJlY3Rpb24sIG1vdmVLZXlzKTsKICAgIH07CiAgICByZXR1cm4gewogICAgICBtb2NrRGF0YSwKICAgICAgdGFyZ2V0S2V5cywKICAgICAgaGFuZGxlQ2hhbmdlLAogICAgICBnZXRNb2NrLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRyYW5zZmVyCiAgICA6ZGF0YS1zb3VyY2U9Im1vY2tEYXRhIgogICAgc2hvdy1zZWFyY2gKICAgIDpsaXN0LXN0eWxlPSJ7CiAgICAgIHdpZHRoOiAnMjUwcHgnLAogICAgICBoZWlnaHQ6ICczMDBweCcsCiAgICB9IgogICAgOm9wZXJhdGlvbnM9IlsndG8gcmlnaHQnLCAndG8gbGVmdCddIgogICAgOnRhcmdldC1rZXlzPSJ0YXJnZXRLZXlzIgogICAgOnJlbmRlcj0iaXRlbSA9PiBgJHtpdGVtLnRpdGxlfS0ke2l0ZW0uZGVzY3JpcHRpb259YCIKICAgIEBjaGFuZ2U9ImhhbmRsZUNoYW5nZSIKICA+CiAgICA8dGVtcGxhdGUgI2Zvb3Rlcj4KICAgICAgPGEtYnV0dG9uIHNpemU9InNtYWxsIiBzdHlsZT0iZmxvYXQ6IHJpZ2h0OyBtYXJnaW46IDVweCIgQGNsaWNrPSJnZXRNb2NrIj5yZWxvYWQ8L2EtYnV0dG9uPgogICAgPC90ZW1wbGF0ZT4KICAgIDx0ZW1wbGF0ZSAjbm90Rm91bmRDb250ZW50PgogICAgICA8c3Bhbj7msqHmlbDmja48L3NwYW4+CiAgICA8L3RlbXBsYXRlPgogIDwvYS10cmFuc2Zlcj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYsIG9uTW91bnRlZCB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBtb2NrRGF0YSA9IHJlZihbXSk7CiAgICBjb25zdCB0YXJnZXRLZXlzID0gcmVmKFtdKTsKICAgIG9uTW91bnRlZCgoKSA9PiB7CiAgICAgIGdldE1vY2soKTsKICAgIH0pOwogICAgY29uc3QgZ2V0TW9jayA9ICgpID0+IHsKICAgICAgY29uc3Qga2V5cyA9IFtdOwogICAgICBjb25zdCBtRGF0YSA9IFtdOwogICAgICBmb3IgKGxldCBpID0gMDsgaSA8IDIwOyBpKyspIHsKICAgICAgICBjb25zdCBkYXRhID0gewogICAgICAgICAga2V5OiBpLnRvU3RyaW5nKCksCiAgICAgICAgICB0aXRsZTogYGNvbnRlbnQke2kgKyAxfWAsCiAgICAgICAgICBkZXNjcmlwdGlvbjogYGRlc2NyaXB0aW9uIG9mIGNvbnRlbnQke2kgKyAxfWAsCiAgICAgICAgICBjaG9zZW46IE1hdGgucmFuZG9tKCkgKiAyID4gMSwKICAgICAgICB9OwogICAgICAgIGlmIChkYXRhLmNob3NlbikgewogICAgICAgICAga2V5cy5wdXNoKGRhdGEua2V5KTsKICAgICAgICB9CiAgICAgICAgbURhdGEucHVzaChkYXRhKTsKICAgICAgfQogICAgICBtb2NrRGF0YS52YWx1ZSA9IG1EYXRhOwogICAgICB0YXJnZXRLZXlzLnZhbHVlID0ga2V5czsKICAgIH07CiAgICBjb25zdCBoYW5kbGVDaGFuZ2UgPSAoa2V5cywgZGlyZWN0aW9uLCBtb3ZlS2V5cykgPT4gewogICAgICB0YXJnZXRLZXlzLnZhbHVlID0ga2V5czsKICAgICAgY29uc29sZS5sb2coa2V5cywgZGlyZWN0aW9uLCBtb3ZlS2V5cyk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgbW9ja0RhdGEsCiAgICAgIHRhcmdldEtleXMsCiAgICAgIGhhbmRsZUNoYW5nZSwKICAgICAgZ2V0TW9jaywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:k(()=>[C(e,{"data-source":s.mockData,"show-search":"","list-style":{width:"250px",height:"300px"},operations:["to right","to left"],"target-keys":s.targetKeys,render:i=>`${i.title}-${i.description}`,onChange:s.handleChange},{footer:k(()=>[C(o,{size:"small",style:{float:"right",margin:"5px"},onClick:s.getMock},{default:k(()=>a[0]||(a[0]=[t("reload")])),_:1,__:[0]},8,["onClick"])]),notFoundContent:k(()=>a[1]||(a[1]=[n("span",null,"\u6CA1\u6570\u636E",-1)])),_:1},8,["data-source","target-keys","render","onChange"])]),htmlCode:k(()=>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(`
    279. 

  279.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    280. 

  280.     `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("mockData"),n("span",{class:"token punctuation"},'"')]),t(`
    281. 

  281.     `),n("span",{class:"token attr-name"},"show-search"),t(`
    282. 

  282.     `),n("span",{class:"token attr-name"},":list-style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`{
    283. 

  283.       width: '250px',
    284. 

  284.       height: '300px',
    285. 

  285.     }`),n("span",{class:"token punctuation"},'"')]),t(`
    286. 

  286.     `),n("span",{class:"token attr-name"},":operations"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("['to right', 'to left']"),n("span",{class:"token punctuation"},'"')]),t(`
    287. 

  287.     `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    288. 

  288.     `),n("span",{class:"token attr-name"},":render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("item => `${item.title}-${item.description}`"),n("span",{class:"token punctuation"},'"')]),t(`
    289. 

  289.     `),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(`
    290. 

  290.   `),n("span",{class:"token punctuation"},">")]),t(`
    291. 

  291.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#footer"),n("span",{class:"token punctuation"},">")]),t(`
    292. 

  292.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),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 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"},"float"),n("span",{class:"token punctuation"},":"),t(" right"),n("span",{class:"token punctuation"},";"),t(),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),t(" 5px")]),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("getMock"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("reload"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
    293. 

  293.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    294. 

  294.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#notFoundContent"),n("span",{class:"token punctuation"},">")]),t(`
    295. 

  295.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),n("span",{class:"token punctuation"},">")]),t("\u6CA1\u6570\u636E"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
    296. 

  296.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    297. 

  297.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-transfer")]),n("span",{class:"token punctuation"},">")]),t(`
    298. 

  298. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    299. 

  299. `),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(`
    300. 

  300. `),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(" onMounted "),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(`
    301. 

  301. `),n("span",{class:"token keyword"},"interface"),t(),n("span",{class:"token class-name"},"MockData"),t(),n("span",{class:"token punctuation"},"{"),t(`
    302. 

  302.   `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    303. 

  303.   `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    304. 

  304.   `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    305. 

  305.   `),n("span",{class:"token literal-property property"},"chosen"),n("span",{class:"token operator"},":"),t(" boolean"),n("span",{class:"token punctuation"},";"),t(`
    306. 

  306. `),n("span",{class:"token punctuation"},"}"),t(`
    307. 

  307. `),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(`
    308. 

  308.   `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    309. 

  309.     `),n("span",{class:"token keyword"},"const"),t(" mockData "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("MockData"),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(`
    310. 

  310. 

  311.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),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(`
    312. 

  312.     `),n("span",{class:"token function"},"onMounted"),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(`
    313. 

  313.       `),n("span",{class:"token function"},"getMock"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    314. 

  314.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    315. 

  315.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"getMock"),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(`
    316. 

  316.       `),n("span",{class:"token keyword"},"const"),t(" keys "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    317. 

  317.       `),n("span",{class:"token keyword"},"const"),t(" mData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    318. 

  318.       `),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"},"20"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    319. 

  319.         `),n("span",{class:"token keyword"},"const"),t(" data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"{"),t(`
    320. 

  320.           `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    321. 

  321.           `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    322. 

  322.           `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"description of content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    323. 

  323.           `),n("span",{class:"token literal-property property"},"chosen"),n("span",{class:"token operator"},":"),t(" Math"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"random"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"*"),t(),n("span",{class:"token number"},"2"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},","),t(`
    324. 

  324.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    325. 

  325.         `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("chosen"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    326. 

  326.           keys`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    327. 

  327.         `),n("span",{class:"token punctuation"},"}"),t(`
    328. 

  328.         mData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    329. 

  329.       `),n("span",{class:"token punctuation"},"}"),t(`
    330. 

  330.       mockData`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" mData"),n("span",{class:"token punctuation"},";"),t(`
    331. 

  331.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    332. 

  332.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    333. 

  333.     `),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"},"keys"),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 literal-property property"},"direction"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"moveKeys"),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(`
    334. 

  334.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    335. 

  335.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("keys"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},","),t(" moveKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    336. 

  336.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    337. 

  337.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    338. 

  338.       mockData`),n("span",{class:"token punctuation"},","),t(`
    339. 

  339.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    340. 

  340.       handleChange`),n("span",{class:"token punctuation"},","),t(`
    341. 

  341.       getMock`),n("span",{class:"token punctuation"},","),t(`
    342. 

  342.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    343. 

  343.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    344. 

  344. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    345. 

  345. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    346. 

  346. `)])],-1)])),jsVersionHtml:k(()=>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(`
    347. 

  347.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    348. 

  348.     `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("mockData"),n("span",{class:"token punctuation"},'"')]),t(`
    349. 

  349.     `),n("span",{class:"token attr-name"},"show-search"),t(`
    350. 

  350.     `),n("span",{class:"token attr-name"},":list-style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`{
    351. 

  351.       width: '250px',
    352. 

  352.       height: '300px',
    353. 

  353.     }`),n("span",{class:"token punctuation"},'"')]),t(`
    354. 

  354.     `),n("span",{class:"token attr-name"},":operations"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("['to right', 'to left']"),n("span",{class:"token punctuation"},'"')]),t(`
    355. 

  355.     `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    356. 

  356.     `),n("span",{class:"token attr-name"},":render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("item => `${item.title}-${item.description}`"),n("span",{class:"token punctuation"},'"')]),t(`
    357. 

  357.     `),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(`
    358. 

  358.   `),n("span",{class:"token punctuation"},">")]),t(`
    359. 

  359.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#footer"),n("span",{class:"token punctuation"},">")]),t(`
    360. 

  360.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),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 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"},"float"),n("span",{class:"token punctuation"},":"),t(" right"),n("span",{class:"token punctuation"},";"),t(),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),t(" 5px")]),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("getMock"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("reload"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
    361. 

  361.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    362. 

  362.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#notFoundContent"),n("span",{class:"token punctuation"},">")]),t(`
    363. 

  363.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),n("span",{class:"token punctuation"},">")]),t("\u6CA1\u6570\u636E"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
    364. 

  364.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    365. 

  365.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-transfer")]),n("span",{class:"token punctuation"},">")]),t(`
    366. 

  366. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    367. 

  367. `),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(`
    368. 

  368. `),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(" onMounted "),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(`
    369. 

  369. `),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(`
    370. 

  370.   `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    371. 

  371.     `),n("span",{class:"token keyword"},"const"),t(" mockData "),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(`
    372. 

  372.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),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(`
    373. 

  373.     `),n("span",{class:"token function"},"onMounted"),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(`
    374. 

  374.       `),n("span",{class:"token function"},"getMock"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    375. 

  375.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    376. 

  376.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"getMock"),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(`
    377. 

  377.       `),n("span",{class:"token keyword"},"const"),t(" keys "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    378. 

  378.       `),n("span",{class:"token keyword"},"const"),t(" mData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    379. 

  379.       `),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"},"20"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    380. 

  380.         `),n("span",{class:"token keyword"},"const"),t(" data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"{"),t(`
    381. 

  381.           `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    382. 

  382.           `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    383. 

  383.           `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"description of content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    384. 

  384.           `),n("span",{class:"token literal-property property"},"chosen"),n("span",{class:"token operator"},":"),t(" Math"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"random"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"*"),t(),n("span",{class:"token number"},"2"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},","),t(`
    385. 

  385.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    386. 

  386.         `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("chosen"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    387. 

  387.           keys`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    388. 

  388.         `),n("span",{class:"token punctuation"},"}"),t(`
    389. 

  389.         mData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    390. 

  390.       `),n("span",{class:"token punctuation"},"}"),t(`
    391. 

  391.       mockData`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" mData"),n("span",{class:"token punctuation"},";"),t(`
    392. 

  392.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    393. 

  393.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    394. 

  394.     `),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"},[t("keys"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},","),t(" moveKeys")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    395. 

  395.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    396. 

  396.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("keys"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},","),t(" moveKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    397. 

  397.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    398. 

  398.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    399. 

  399.       mockData`),n("span",{class:"token punctuation"},","),t(`
    400. 

  400.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    401. 

  401.       handleChange`),n("span",{class:"token punctuation"},","),t(`
    402. 

  402.       getMock`),n("span",{class:"token punctuation"},","),t(`
    403. 

  403.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    404. 

  404.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    405. 

  405. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    406. 

  406. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    407. 

  407. `)])],-1)])),_:1})}var un=b(pn,[["render",ln]]);const kn=G({setup(){const s=A([]),a=A([]);K(()=>{p()});const p=()=>{const l=[],u=[];for(let o=0;o<20;o++){const e={key:o.toString(),title:`content${o+1}`,description:`description of content${o+1}`,chosen:Math.random()*2>1};e.chosen&&l.push(e.key),u.push(e)}s.value=u,a.value=l};return{mockData:s,targetKeys:a,handleChange:(l,u,o)=>{a.value=l,console.log(l,u,o)},getMock:p}}}),rn={class:"custom-item",style:{color:"red"}};function dn(s,a,p,I,l,u){const o=r("a-transfer"),e=r("demo-box");return h(),Z(e,{jsfiddle:{us:"Custom each Transfer Item, and in this way you can render a complex datasource.",cn:"\u81EA\u5B9A\u4E49\u6E32\u67D3\u6BCF\u4E00\u4E2A Transfer Item\uFF0C\u53EF\u7528\u4E8E\u6E32\u67D3\u590D\u6742\u6570\u636E\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
    408. 

  408. <p>\u81EA\u5B9A\u4E49\u6E32\u67D3\u6BCF\u4E00\u4E2A Transfer Item\uFF0C\u53EF\u7528\u4E8E\u6E32\u67D3\u590D\u6742\u6570\u636E\u3002</p>
    409. 

  409. <h2 id="en-us">en-US</h2>
    410. 

  410. <p>Custom each Transfer Item, and in this way you can render a complex datasource.</p>
    411. 

  411. `,order:3,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u6E32\u67D3\u884C\u6570\u636E","en-US":"Custom datasource"},relativePath:"src/docs/transfer/demo/custom-item.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRyYW5zZmVyCiAgICA6ZGF0YS1zb3VyY2U9Im1vY2tEYXRhIgogICAgOmxpc3Qtc3R5bGU9InsKICAgICAgd2lkdGg6ICczMDBweCcsCiAgICAgIGhlaWdodDogJzMwMHB4JywKICAgIH0iCiAgICA6dGFyZ2V0LWtleXM9InRhcmdldEtleXMiCiAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgPgogICAgPHRlbXBsYXRlICNyZW5kZXI9Iml0ZW0iPgogICAgICA8c3BhbiBjbGFzcz0iY3VzdG9tLWl0ZW0iIHN0eWxlPSJjb2xvcjogcmVkIj57eyBpdGVtLnRpdGxlIH19IC0ge3sgaXRlbS5kZXNjcmlwdGlvbiB9fTwvc3Bhbj4KICAgIDwvdGVtcGxhdGU+CiAgPC9hLXRyYW5zZmVyPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYsIG9uTW91bnRlZCB9IGZyb20gJ3Z1ZSc7CmludGVyZmFjZSBNb2NrRGF0YSB7CiAga2V5OiBzdHJpbmc7CiAgdGl0bGU6IHN0cmluZzsKICBkZXNjcmlwdGlvbjogc3RyaW5nOwogIGNob3NlbjogYm9vbGVhbjsKfQpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgbW9ja0RhdGEgPSByZWY8TW9ja0RhdGFbXT4oW10pOwoKICAgIGNvbnN0IHRhcmdldEtleXMgPSByZWY8c3RyaW5nW10+KFtdKTsKICAgIG9uTW91bnRlZCgoKSA9PiB7CiAgICAgIGdldE1vY2soKTsKICAgIH0pOwogICAgY29uc3QgZ2V0TW9jayA9ICgpID0+IHsKICAgICAgY29uc3Qga2V5cyA9IFtdOwogICAgICBjb25zdCBtRGF0YSA9IFtdOwogICAgICBmb3IgKGxldCBpID0gMDsgaSA8IDIwOyBpKyspIHsKICAgICAgICBjb25zdCBkYXRhID0gewogICAgICAgICAga2V5OiBpLnRvU3RyaW5nKCksCiAgICAgICAgICB0aXRsZTogYGNvbnRlbnQke2kgKyAxfWAsCiAgICAgICAgICBkZXNjcmlwdGlvbjogYGRlc2NyaXB0aW9uIG9mIGNvbnRlbnQke2kgKyAxfWAsCiAgICAgICAgICBjaG9zZW46IE1hdGgucmFuZG9tKCkgKiAyID4gMSwKICAgICAgICB9OwogICAgICAgIGlmIChkYXRhLmNob3NlbikgewogICAgICAgICAga2V5cy5wdXNoKGRhdGEua2V5KTsKICAgICAgICB9CiAgICAgICAgbURhdGEucHVzaChkYXRhKTsKICAgICAgfQogICAgICBtb2NrRGF0YS52YWx1ZSA9IG1EYXRhOwogICAgICB0YXJnZXRLZXlzLnZhbHVlID0ga2V5czsKICAgIH07CiAgICBjb25zdCBoYW5kbGVDaGFuZ2UgPSAoa2V5czogc3RyaW5nW10sIGRpcmVjdGlvbjogc3RyaW5nLCBtb3ZlS2V5czogc3RyaW5nW10pID0+IHsKICAgICAgdGFyZ2V0S2V5cy52YWx1ZSA9IGtleXM7CiAgICAgIGNvbnNvbGUubG9nKGtleXMsIGRpcmVjdGlvbiwgbW92ZUtleXMpOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIG1vY2tEYXRhLAogICAgICB0YXJnZXRLZXlzLAogICAgICBoYW5kbGVDaGFuZ2UsCiAgICAgIGdldE1vY2ssCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRyYW5zZmVyCiAgICA6ZGF0YS1zb3VyY2U9Im1vY2tEYXRhIgogICAgOmxpc3Qtc3R5bGU9InsKICAgICAgd2lkdGg6ICczMDBweCcsCiAgICAgIGhlaWdodDogJzMwMHB4JywKICAgIH0iCiAgICA6dGFyZ2V0LWtleXM9InRhcmdldEtleXMiCiAgICBAY2hhbmdlPSJoYW5kbGVDaGFuZ2UiCiAgPgogICAgPHRlbXBsYXRlICNyZW5kZXI9Iml0ZW0iPgogICAgICA8c3BhbiBjbGFzcz0iY3VzdG9tLWl0ZW0iIHN0eWxlPSJjb2xvcjogcmVkIj57eyBpdGVtLnRpdGxlIH19IC0ge3sgaXRlbS5kZXNjcmlwdGlvbiB9fTwvc3Bhbj4KICAgIDwvdGVtcGxhdGU+CiAgPC9hLXRyYW5zZmVyPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiwgb25Nb3VudGVkIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IG1vY2tEYXRhID0gcmVmKFtdKTsKICAgIGNvbnN0IHRhcmdldEtleXMgPSByZWYoW10pOwogICAgb25Nb3VudGVkKCgpID0+IHsKICAgICAgZ2V0TW9jaygpOwogICAgfSk7CiAgICBjb25zdCBnZXRNb2NrID0gKCkgPT4gewogICAgICBjb25zdCBrZXlzID0gW107CiAgICAgIGNvbnN0IG1EYXRhID0gW107CiAgICAgIGZvciAobGV0IGkgPSAwOyBpIDwgMjA7IGkrKykgewogICAgICAgIGNvbnN0IGRhdGEgPSB7CiAgICAgICAgICBrZXk6IGkudG9TdHJpbmcoKSwKICAgICAgICAgIHRpdGxlOiBgY29udGVudCR7aSArIDF9YCwKICAgICAgICAgIGRlc2NyaXB0aW9uOiBgZGVzY3JpcHRpb24gb2YgY29udGVudCR7aSArIDF9YCwKICAgICAgICAgIGNob3NlbjogTWF0aC5yYW5kb20oKSAqIDIgPiAxLAogICAgICAgIH07CiAgICAgICAgaWYgKGRhdGEuY2hvc2VuKSB7CiAgICAgICAgICBrZXlzLnB1c2goZGF0YS5rZXkpOwogICAgICAgIH0KICAgICAgICBtRGF0YS5wdXNoKGRhdGEpOwogICAgICB9CiAgICAgIG1vY2tEYXRhLnZhbHVlID0gbURhdGE7CiAgICAgIHRhcmdldEtleXMudmFsdWUgPSBrZXlzOwogICAgfTsKICAgIGNvbnN0IGhhbmRsZUNoYW5nZSA9IChrZXlzLCBkaXJlY3Rpb24sIG1vdmVLZXlzKSA9PiB7CiAgICAgIHRhcmdldEtleXMudmFsdWUgPSBrZXlzOwogICAgICBjb25zb2xlLmxvZyhrZXlzLCBkaXJlY3Rpb24sIG1vdmVLZXlzKTsKICAgIH07CiAgICByZXR1cm4gewogICAgICBtb2NrRGF0YSwKICAgICAgdGFyZ2V0S2V5cywKICAgICAgaGFuZGxlQ2hhbmdlLAogICAgICBnZXRNb2NrLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:k(()=>[C(o,{"data-source":s.mockData,"list-style":{width:"300px",height:"300px"},"target-keys":s.targetKeys,onChange:s.handleChange},{render:k(c=>[n("span",rn,R(c.title)+" - "+R(c.description),1)]),_:1},8,["data-source","target-keys","onChange"])]),htmlCode:k(()=>a[0]||(a[0]=[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(`
    412. 

  412.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    413. 

  413.     `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("mockData"),n("span",{class:"token punctuation"},'"')]),t(`
    414. 

  414.     `),n("span",{class:"token attr-name"},":list-style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`{
    415. 

  415.       width: '300px',
    416. 

  416.       height: '300px',
    417. 

  417.     }`),n("span",{class:"token punctuation"},'"')]),t(`
    418. 

  418.     `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    419. 

  419.     `),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(`
    420. 

  420.   `),n("span",{class:"token punctuation"},">")]),t(`
    421. 

  421.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("item"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    422. 

  422.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("custom-item"),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"},"color"),n("span",{class:"token punctuation"},":"),t(" red")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),t("{{ item.title }} - {{ item.description }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
    423. 

  423.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    424. 

  424.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-transfer")]),n("span",{class:"token punctuation"},">")]),t(`
    425. 

  425. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    426. 

  426. `),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(`
    427. 

  427. `),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(" onMounted "),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(`
    428. 

  428. `),n("span",{class:"token keyword"},"interface"),t(),n("span",{class:"token class-name"},"MockData"),t(),n("span",{class:"token punctuation"},"{"),t(`
    429. 

  429.   `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    430. 

  430.   `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    431. 

  431.   `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    432. 

  432.   `),n("span",{class:"token literal-property property"},"chosen"),n("span",{class:"token operator"},":"),t(" boolean"),n("span",{class:"token punctuation"},";"),t(`
    433. 

  433. `),n("span",{class:"token punctuation"},"}"),t(`
    434. 

  434. `),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(`
    435. 

  435.   `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    436. 

  436.     `),n("span",{class:"token keyword"},"const"),t(" mockData "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("MockData"),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(`
    437. 

  437. 

  438.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),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(`
    439. 

  439.     `),n("span",{class:"token function"},"onMounted"),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(`
    440. 

  440.       `),n("span",{class:"token function"},"getMock"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    441. 

  441.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    442. 

  442.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"getMock"),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(`
    443. 

  443.       `),n("span",{class:"token keyword"},"const"),t(" keys "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    444. 

  444.       `),n("span",{class:"token keyword"},"const"),t(" mData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    445. 

  445.       `),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"},"20"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    446. 

  446.         `),n("span",{class:"token keyword"},"const"),t(" data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"{"),t(`
    447. 

  447.           `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    448. 

  448.           `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    449. 

  449.           `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"description of content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    450. 

  450.           `),n("span",{class:"token literal-property property"},"chosen"),n("span",{class:"token operator"},":"),t(" Math"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"random"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"*"),t(),n("span",{class:"token number"},"2"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},","),t(`
    451. 

  451.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    452. 

  452.         `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("chosen"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    453. 

  453.           keys`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    454. 

  454.         `),n("span",{class:"token punctuation"},"}"),t(`
    455. 

  455.         mData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    456. 

  456.       `),n("span",{class:"token punctuation"},"}"),t(`
    457. 

  457.       mockData`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" mData"),n("span",{class:"token punctuation"},";"),t(`
    458. 

  458.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    459. 

  459.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    460. 

  460.     `),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"},"keys"),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 literal-property property"},"direction"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"moveKeys"),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(`
    461. 

  461.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    462. 

  462.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("keys"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},","),t(" moveKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    463. 

  463.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    464. 

  464.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    465. 

  465.       mockData`),n("span",{class:"token punctuation"},","),t(`
    466. 

  466.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    467. 

  467.       handleChange`),n("span",{class:"token punctuation"},","),t(`
    468. 

  468.       getMock`),n("span",{class:"token punctuation"},","),t(`
    469. 

  469.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    470. 

  470.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    471. 

  471. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    472. 

  472. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    473. 

  473. `)])],-1)])),jsVersionHtml:k(()=>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(`
    474. 

  474.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    475. 

  475.     `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("mockData"),n("span",{class:"token punctuation"},'"')]),t(`
    476. 

  476.     `),n("span",{class:"token attr-name"},":list-style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`{
    477. 

  477.       width: '300px',
    478. 

  478.       height: '300px',
    479. 

  479.     }`),n("span",{class:"token punctuation"},'"')]),t(`
    480. 

  480.     `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    481. 

  481.     `),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(`
    482. 

  482.   `),n("span",{class:"token punctuation"},">")]),t(`
    483. 

  483.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("item"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    484. 

  484.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),t(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("custom-item"),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"},"color"),n("span",{class:"token punctuation"},":"),t(" red")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),t("{{ item.title }} - {{ item.description }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
    485. 

  485.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    486. 

  486.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-transfer")]),n("span",{class:"token punctuation"},">")]),t(`
    487. 

  487. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    488. 

  488. `),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(`
    489. 

  489. `),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(" onMounted "),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(`
    490. 

  490. `),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(`
    491. 

  491.   `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    492. 

  492.     `),n("span",{class:"token keyword"},"const"),t(" mockData "),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(`
    493. 

  493.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),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(`
    494. 

  494.     `),n("span",{class:"token function"},"onMounted"),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(`
    495. 

  495.       `),n("span",{class:"token function"},"getMock"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    496. 

  496.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    497. 

  497.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"getMock"),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(`
    498. 

  498.       `),n("span",{class:"token keyword"},"const"),t(" keys "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    499. 

  499.       `),n("span",{class:"token keyword"},"const"),t(" mData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    500. 

  500.       `),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"},"20"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    501. 

  501.         `),n("span",{class:"token keyword"},"const"),t(" data "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"{"),t(`
    502. 

  502.           `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    503. 

  503.           `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    504. 

  504.           `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"description of content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    505. 

  505.           `),n("span",{class:"token literal-property property"},"chosen"),n("span",{class:"token operator"},":"),t(" Math"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"random"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"*"),t(),n("span",{class:"token number"},"2"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},","),t(`
    506. 

  506.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    507. 

  507.         `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("chosen"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    508. 

  508.           keys`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    509. 

  509.         `),n("span",{class:"token punctuation"},"}"),t(`
    510. 

  510.         mData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    511. 

  511.       `),n("span",{class:"token punctuation"},"}"),t(`
    512. 

  512.       mockData`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" mData"),n("span",{class:"token punctuation"},";"),t(`
    513. 

  513.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    514. 

  514.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    515. 

  515.     `),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"},[t("keys"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},","),t(" moveKeys")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    516. 

  516.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    517. 

  517.       console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("keys"),n("span",{class:"token punctuation"},","),t(" direction"),n("span",{class:"token punctuation"},","),t(" moveKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    518. 

  518.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    519. 

  519.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    520. 

  520.       mockData`),n("span",{class:"token punctuation"},","),t(`
    521. 

  521.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    522. 

  522.       handleChange`),n("span",{class:"token punctuation"},","),t(`
    523. 

  523.       getMock`),n("span",{class:"token punctuation"},","),t(`
    524. 

  524.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    525. 

  525.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    526. 

  526. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    527. 

  527. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    528. 

  528. `)])],-1)])),_:1})}var gn=b(kn,[["render",dn]]);const S=[];for(let s=0;s<20;s++)S.push({key:s.toString(),title:`content${s+1}`,description:`description of content${s+1}`,disabled:s%4===0});const In=S.filter(s=>+s.key%3>1).map(s=>s.key),Cn=[{dataIndex:"title",title:"Name"},{dataIndex:"description",title:"Description"}],An=[{dataIndex:"title",title:"Name"}],mn=G({setup(){const s=A(In),a=A(!1),p=A(!1),I=A(Cn),l=A(An);return{mockData:S,targetKeys:s,disabled:a,showSearch:p,leftColumns:I,rightColumns:l,onChange:e=>{s.value=e},getRowSelection:({disabled:e,selectedKeys:c,onItemSelectAll:i,onItemSelect:d})=>({getCheckboxProps:g=>({disabled:e||g.disabled}),onSelectAll(g,m){const y=m.filter(f=>!f.disabled).map(({key:f})=>f),w=g?X(y,c):X(c,y);i(w,g)},onSelect({key:g},m){d(g,m)},selectedRowKeys:c})}}});function yn(s,a,p,I,l,u){const o=r("a-table"),e=r("a-transfer"),c=r("a-switch"),i=r("demo-box");return h(),Z(i,{jsfiddle:{us:"Customize render list with Table component.",cn:"\u4F7F\u7528 Table \u7EC4\u4EF6\u4F5C\u4E3A\u81EA\u5B9A\u4E49\u6E32\u67D3\u5217\u8868\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
    529. 

  529. <p>\u4F7F\u7528 Table \u7EC4\u4EF6\u4F5C\u4E3A\u81EA\u5B9A\u4E49\u6E32\u67D3\u5217\u8868\u3002</p>
    530. 

  530. <h2 id="en-us">en-US</h2>
    531. 

  531. <p>Customize render list with Table component.</p>
    532. 

  532. `,order:4,title:{"zh-CN":"\u8868\u683C\u7A7F\u68AD\u6846","en-US":"Table Transfer"},relativePath:"src/docs/transfer/demo/table-transfer.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS10cmFuc2ZlcgogICAgICA6ZGF0YS1zb3VyY2U9Im1vY2tEYXRhIgogICAgICA6dGFyZ2V0LWtleXM9InRhcmdldEtleXMiCiAgICAgIDpkaXNhYmxlZD0iZGlzYWJsZWQiCiAgICAgIDpzaG93LXNlYXJjaD0ic2hvd1NlYXJjaCIKICAgICAgOmZpbHRlci1vcHRpb249IihpbnB1dFZhbHVlLCBpdGVtKSA9PiBpdGVtLnRpdGxlLmluZGV4T2YoaW5wdXRWYWx1ZSkgIT09IC0xIgogICAgICA6c2hvdy1zZWxlY3QtYWxsPSJmYWxzZSIKICAgICAgQGNoYW5nZT0ib25DaGFuZ2UiCiAgICA+CiAgICAgIDx0ZW1wbGF0ZQogICAgICAgICNjaGlsZHJlbj0iewogICAgICAgICAgZGlyZWN0aW9uLAogICAgICAgICAgZmlsdGVyZWRJdGVtcywKICAgICAgICAgIHNlbGVjdGVkS2V5cywKICAgICAgICAgIGRpc2FibGVkOiBsaXN0RGlzYWJsZWQsCiAgICAgICAgICBvbkl0ZW1TZWxlY3RBbGwsCiAgICAgICAgICBvbkl0ZW1TZWxlY3QsCiAgICAgICAgfSIKICAgICAgPgogICAgICAgIDxhLXRhYmxlCiAgICAgICAgICA6cm93LXNlbGVjdGlvbj0iCiAgICAgICAgICAgIGdldFJvd1NlbGVjdGlvbih7CiAgICAgICAgICAgICAgZGlzYWJsZWQ6IGxpc3REaXNhYmxlZCwKICAgICAgICAgICAgICBzZWxlY3RlZEtleXMsCiAgICAgICAgICAgICAgb25JdGVtU2VsZWN0QWxsLAogICAgICAgICAgICAgIG9uSXRlbVNlbGVjdCwKICAgICAgICAgICAgfSkKICAgICAgICAgICIKICAgICAgICAgIDpjb2x1bW5zPSJkaXJlY3Rpb24gPT09ICdsZWZ0JyA/IGxlZnRDb2x1bW5zIDogcmlnaHRDb2x1bW5zIgogICAgICAgICAgOmRhdGEtc291cmNlPSJmaWx0ZXJlZEl0ZW1zIgogICAgICAgICAgc2l6ZT0ic21hbGwiCiAgICAgICAgICA6c3R5bGU9InsgcG9pbnRlckV2ZW50czogbGlzdERpc2FibGVkID8gJ25vbmUnIDogbnVsbCB9IgogICAgICAgICAgOmN1c3RvbS1yb3c9IgogICAgICAgICAgICAoeyBrZXksIGRpc2FibGVkOiBpdGVtRGlzYWJsZWQgfSkgPT4gKHsKICAgICAgICAgICAgICBvbkNsaWNrOiAoKSA9PiB7CiAgICAgICAgICAgICAgICBpZiAoaXRlbURpc2FibGVkIHx8IGxpc3REaXNhYmxlZCkgcmV0dXJuOwogICAgICAgICAgICAgICAgb25JdGVtU2VsZWN0KGtleSwgIXNlbGVjdGVkS2V5cy5pbmNsdWRlcyhrZXkpKTsKICAgICAgICAgICAgICB9LAogICAgICAgICAgICB9KQogICAgICAgICAgIgogICAgICAgIC8+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2EtdHJhbnNmZXI+CiAgICA8YS1zd2l0Y2gKICAgICAgdW4tY2hlY2tlZC1jaGlsZHJlbj0iZGlzYWJsZWQiCiAgICAgIGNoZWNrZWQtY2hpbGRyZW49ImRpc2FibGVkIgogICAgICB2LW1vZGVsOmNoZWNrZWQ9ImRpc2FibGVkIgogICAgICBzdHlsZT0ibWFyZ2luLXRvcDogMTZweCIKICAgIC8+CiAgICA8YS1zd2l0Y2gKICAgICAgdW4tY2hlY2tlZC1jaGlsZHJlbj0ic2hvd1NlYXJjaCIKICAgICAgY2hlY2tlZC1jaGlsZHJlbj0ic2hvd1NlYXJjaCIKICAgICAgdi1tb2RlbDpjaGVja2VkPSJzaG93U2VhcmNoIgogICAgICBzdHlsZT0ibWFyZ2luLXRvcDogMTZweCIKICAgIC8+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkaWZmZXJlbmNlIH0gZnJvbSAnbG9kYXNoLWVzJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwppbnRlcmZhY2UgTW9ja0RhdGEgewogIGtleTogc3RyaW5nOwogIHRpdGxlOiBzdHJpbmc7CiAgZGVzY3JpcHRpb246IHN0cmluZzsKICBkaXNhYmxlZDogYm9vbGVhbjsKfQp0eXBlIHRhYmxlQ29sdW1uID0gUmVjb3JkPHN0cmluZywgc3RyaW5nPjsKY29uc3QgbW9ja0RhdGE6IE1vY2tEYXRhW10gPSBbXTsKZm9yIChsZXQgaSA9IDA7IGkgPCAyMDsgaSsrKSB7CiAgbW9ja0RhdGEucHVzaCh7CiAgICBrZXk6IGkudG9TdHJpbmcoKSwKICAgIHRpdGxlOiBgY29udGVudCR7aSArIDF9YCwKICAgIGRlc2NyaXB0aW9uOiBgZGVzY3JpcHRpb24gb2YgY29udGVudCR7aSArIDF9YCwKICAgIGRpc2FibGVkOiBpICUgNCA9PT0gMCwKICB9KTsKfQoKY29uc3Qgb3JpZ2luVGFyZ2V0S2V5cyA9IG1vY2tEYXRhLmZpbHRlcihpdGVtID0+ICtpdGVtLmtleSAlIDMgPiAxKS5tYXAoaXRlbSA9PiBpdGVtLmtleSk7Cgpjb25zdCBsZWZ0VGFibGVDb2x1bW5zID0gWwogIHsKICAgIGRhdGFJbmRleDogJ3RpdGxlJywKICAgIHRpdGxlOiAnTmFtZScsCiAgfSwKICB7CiAgICBkYXRhSW5kZXg6ICdkZXNjcmlwdGlvbicsCiAgICB0aXRsZTogJ0Rlc2NyaXB0aW9uJywKICB9LApdOwpjb25zdCByaWdodFRhYmxlQ29sdW1ucyA9IFsKICB7CiAgICBkYXRhSW5kZXg6ICd0aXRsZScsCiAgICB0aXRsZTogJ05hbWUnLAogIH0sCl07CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdGFyZ2V0S2V5cyA9IHJlZjxzdHJpbmdbXT4ob3JpZ2luVGFyZ2V0S2V5cyk7CiAgICBjb25zdCBkaXNhYmxlZCA9IHJlZjxib29sZWFuPihmYWxzZSk7CiAgICBjb25zdCBzaG93U2VhcmNoID0gcmVmPGJvb2xlYW4+KGZhbHNlKTsKICAgIGNvbnN0IGxlZnRDb2x1bW5zID0gcmVmPHRhYmxlQ29sdW1uW10+KGxlZnRUYWJsZUNvbHVtbnMpOwogICAgY29uc3QgcmlnaHRDb2x1bW5zID0gcmVmPHRhYmxlQ29sdW1uW10+KHJpZ2h0VGFibGVDb2x1bW5zKTsKCiAgICBjb25zdCBvbkNoYW5nZSA9IChuZXh0VGFyZ2V0S2V5czogc3RyaW5nW10pID0+IHsKICAgICAgdGFyZ2V0S2V5cy52YWx1ZSA9IG5leHRUYXJnZXRLZXlzOwogICAgfTsKCiAgICBjb25zdCBnZXRSb3dTZWxlY3Rpb24gPSAoewogICAgICBkaXNhYmxlZCwKICAgICAgc2VsZWN0ZWRLZXlzLAogICAgICBvbkl0ZW1TZWxlY3RBbGwsCiAgICAgIG9uSXRlbVNlbGVjdCwKICAgIH06IFJlY29yZDxzdHJpbmcsIGFueT4pID0+IHsKICAgICAgcmV0dXJuIHsKICAgICAgICBnZXRDaGVja2JveFByb3BzOiAoaXRlbTogUmVjb3JkPHN0cmluZywgc3RyaW5nIHwgYm9vbGVhbj4pID0+ICh7CiAgICAgICAgICBkaXNhYmxlZDogZGlzYWJsZWQgfHwgaXRlbS5kaXNhYmxlZCwKICAgICAgICB9KSwKICAgICAgICBvblNlbGVjdEFsbChzZWxlY3RlZDogYm9vbGVhbiwgc2VsZWN0ZWRSb3dzOiBSZWNvcmQ8c3RyaW5nLCBzdHJpbmcgfCBib29sZWFuPltdKSB7CiAgICAgICAgICBjb25zdCB0cmVlU2VsZWN0ZWRLZXlzID0gc2VsZWN0ZWRSb3dzCiAgICAgICAgICAgIC5maWx0ZXIoaXRlbSA9PiAhaXRlbS5kaXNhYmxlZCkKICAgICAgICAgICAgLm1hcCgoeyBrZXkgfSkgPT4ga2V5KTsKICAgICAgICAgIGNvbnN0IGRpZmZLZXlzID0gc2VsZWN0ZWQKICAgICAgICAgICAgPyBkaWZmZXJlbmNlKHRyZWVTZWxlY3RlZEtleXMsIHNlbGVjdGVkS2V5cykKICAgICAgICAgICAgOiBkaWZmZXJlbmNlKHNlbGVjdGVkS2V5cywgdHJlZVNlbGVjdGVkS2V5cyk7CiAgICAgICAgICBvbkl0ZW1TZWxlY3RBbGwoZGlmZktleXMsIHNlbGVjdGVkKTsKICAgICAgICB9LAogICAgICAgIG9uU2VsZWN0KHsga2V5IH06IFJlY29yZDxzdHJpbmcsIHN0cmluZz4sIHNlbGVjdGVkOiBib29sZWFuKSB7CiAgICAgICAgICBvbkl0ZW1TZWxlY3Qoa2V5LCBzZWxlY3RlZCk7CiAgICAgICAgfSwKICAgICAgICBzZWxlY3RlZFJvd0tleXM6IHNlbGVjdGVkS2V5cywKICAgICAgfTsKICAgIH07CiAgICByZXR1cm4gewogICAgICBtb2NrRGF0YSwKICAgICAgdGFyZ2V0S2V5cywKICAgICAgZGlzYWJsZWQsCiAgICAgIHNob3dTZWFyY2gsCiAgICAgIGxlZnRDb2x1bW5zLAogICAgICByaWdodENvbHVtbnMsCiAgICAgIG9uQ2hhbmdlLAogICAgICBnZXRSb3dTZWxlY3Rpb24sCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS10cmFuc2ZlcgogICAgICA6ZGF0YS1zb3VyY2U9Im1vY2tEYXRhIgogICAgICA6dGFyZ2V0LWtleXM9InRhcmdldEtleXMiCiAgICAgIDpkaXNhYmxlZD0iZGlzYWJsZWQiCiAgICAgIDpzaG93LXNlYXJjaD0ic2hvd1NlYXJjaCIKICAgICAgOmZpbHRlci1vcHRpb249IihpbnB1dFZhbHVlLCBpdGVtKSA9PiBpdGVtLnRpdGxlLmluZGV4T2YoaW5wdXRWYWx1ZSkgIT09IC0xIgogICAgICA6c2hvdy1zZWxlY3QtYWxsPSJmYWxzZSIKICAgICAgQGNoYW5nZT0ib25DaGFuZ2UiCiAgICA+CiAgICAgIDx0ZW1wbGF0ZQogICAgICAgICNjaGlsZHJlbj0iewogICAgICAgICAgZGlyZWN0aW9uLAogICAgICAgICAgZmlsdGVyZWRJdGVtcywKICAgICAgICAgIHNlbGVjdGVkS2V5cywKICAgICAgICAgIGRpc2FibGVkOiBsaXN0RGlzYWJsZWQsCiAgICAgICAgICBvbkl0ZW1TZWxlY3RBbGwsCiAgICAgICAgICBvbkl0ZW1TZWxlY3QsCiAgICAgICAgfSIKICAgICAgPgogICAgICAgIDxhLXRhYmxlCiAgICAgICAgICA6cm93LXNlbGVjdGlvbj0iCiAgICAgICAgICAgIGdldFJvd1NlbGVjdGlvbih7CiAgICAgICAgICAgICAgZGlzYWJsZWQ6IGxpc3REaXNhYmxlZCwKICAgICAgICAgICAgICBzZWxlY3RlZEtleXMsCiAgICAgICAgICAgICAgb25JdGVtU2VsZWN0QWxsLAogICAgICAgICAgICAgIG9uSXRlbVNlbGVjdCwKICAgICAgICAgICAgfSkKICAgICAgICAgICIKICAgICAgICAgIDpjb2x1bW5zPSJkaXJlY3Rpb24gPT09ICdsZWZ0JyA/IGxlZnRDb2x1bW5zIDogcmlnaHRDb2x1bW5zIgogICAgICAgICAgOmRhdGEtc291cmNlPSJmaWx0ZXJlZEl0ZW1zIgogICAgICAgICAgc2l6ZT0ic21hbGwiCiAgICAgICAgICA6c3R5bGU9InsgcG9pbnRlckV2ZW50czogbGlzdERpc2FibGVkID8gJ25vbmUnIDogbnVsbCB9IgogICAgICAgICAgOmN1c3RvbS1yb3c9IgogICAgICAgICAgICAoeyBrZXksIGRpc2FibGVkOiBpdGVtRGlzYWJsZWQgfSkgPT4gKHsKICAgICAgICAgICAgICBvbkNsaWNrOiAoKSA9PiB7CiAgICAgICAgICAgICAgICBpZiAoaXRlbURpc2FibGVkIHx8IGxpc3REaXNhYmxlZCkgcmV0dXJuOwogICAgICAgICAgICAgICAgb25JdGVtU2VsZWN0KGtleSwgIXNlbGVjdGVkS2V5cy5pbmNsdWRlcyhrZXkpKTsKICAgICAgICAgICAgICB9LAogICAgICAgICAgICB9KQogICAgICAgICAgIgogICAgICAgIC8+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2EtdHJhbnNmZXI+CiAgICA8YS1zd2l0Y2gKICAgICAgdW4tY2hlY2tlZC1jaGlsZHJlbj0iZGlzYWJsZWQiCiAgICAgIGNoZWNrZWQtY2hpbGRyZW49ImRpc2FibGVkIgogICAgICB2LW1vZGVsOmNoZWNrZWQ9ImRpc2FibGVkIgogICAgICBzdHlsZT0ibWFyZ2luLXRvcDogMTZweCIKICAgIC8+CiAgICA8YS1zd2l0Y2gKICAgICAgdW4tY2hlY2tlZC1jaGlsZHJlbj0ic2hvd1NlYXJjaCIKICAgICAgY2hlY2tlZC1jaGlsZHJlbj0ic2hvd1NlYXJjaCIKICAgICAgdi1tb2RlbDpjaGVja2VkPSJzaG93U2VhcmNoIgogICAgICBzdHlsZT0ibWFyZ2luLXRvcDogMTZweCIKICAgIC8+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRpZmZlcmVuY2UgfSBmcm9tICdsb2Rhc2gtZXMnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmNvbnN0IG1vY2tEYXRhID0gW107CmZvciAobGV0IGkgPSAwOyBpIDwgMjA7IGkrKykgewogIG1vY2tEYXRhLnB1c2goewogICAga2V5OiBpLnRvU3RyaW5nKCksCiAgICB0aXRsZTogYGNvbnRlbnQke2kgKyAxfWAsCiAgICBkZXNjcmlwdGlvbjogYGRlc2NyaXB0aW9uIG9mIGNvbnRlbnQke2kgKyAxfWAsCiAgICBkaXNhYmxlZDogaSAlIDQgPT09IDAsCiAgfSk7Cn0KY29uc3Qgb3JpZ2luVGFyZ2V0S2V5cyA9IG1vY2tEYXRhLmZpbHRlcihpdGVtID0+ICtpdGVtLmtleSAlIDMgPiAxKS5tYXAoaXRlbSA9PiBpdGVtLmtleSk7CmNvbnN0IGxlZnRUYWJsZUNvbHVtbnMgPSBbCiAgewogICAgZGF0YUluZGV4OiAndGl0bGUnLAogICAgdGl0bGU6ICdOYW1lJywKICB9LAogIHsKICAgIGRhdGFJbmRleDogJ2Rlc2NyaXB0aW9uJywKICAgIHRpdGxlOiAnRGVzY3JpcHRpb24nLAogIH0sCl07CmNvbnN0IHJpZ2h0VGFibGVDb2x1bW5zID0gWwogIHsKICAgIGRhdGFJbmRleDogJ3RpdGxlJywKICAgIHRpdGxlOiAnTmFtZScsCiAgfSwKXTsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHRhcmdldEtleXMgPSByZWYob3JpZ2luVGFyZ2V0S2V5cyk7CiAgICBjb25zdCBkaXNhYmxlZCA9IHJlZihmYWxzZSk7CiAgICBjb25zdCBzaG93U2VhcmNoID0gcmVmKGZhbHNlKTsKICAgIGNvbnN0IGxlZnRDb2x1bW5zID0gcmVmKGxlZnRUYWJsZUNvbHVtbnMpOwogICAgY29uc3QgcmlnaHRDb2x1bW5zID0gcmVmKHJpZ2h0VGFibGVDb2x1bW5zKTsKICAgIGNvbnN0IG9uQ2hhbmdlID0gbmV4dFRhcmdldEtleXMgPT4gewogICAgICB0YXJnZXRLZXlzLnZhbHVlID0gbmV4dFRhcmdldEtleXM7CiAgICB9OwogICAgY29uc3QgZ2V0Um93U2VsZWN0aW9uID0gKHsgZGlzYWJsZWQsIHNlbGVjdGVkS2V5cywgb25JdGVtU2VsZWN0QWxsLCBvbkl0ZW1TZWxlY3QgfSkgPT4gewogICAgICByZXR1cm4gewogICAgICAgIGdldENoZWNrYm94UHJvcHM6IGl0ZW0gPT4gKHsKICAgICAgICAgIGRpc2FibGVkOiBkaXNhYmxlZCB8fCBpdGVtLmRpc2FibGVkLAogICAgICAgIH0pLAogICAgICAgIG9uU2VsZWN0QWxsKHNlbGVjdGVkLCBzZWxlY3RlZFJvd3MpIHsKICAgICAgICAgIGNvbnN0IHRyZWVTZWxlY3RlZEtleXMgPSBzZWxlY3RlZFJvd3MKICAgICAgICAgICAgLmZpbHRlcihpdGVtID0+ICFpdGVtLmRpc2FibGVkKQogICAgICAgICAgICAubWFwKCh7IGtleSB9KSA9PiBrZXkpOwogICAgICAgICAgY29uc3QgZGlmZktleXMgPSBzZWxlY3RlZAogICAgICAgICAgICA/IGRpZmZlcmVuY2UodHJlZVNlbGVjdGVkS2V5cywgc2VsZWN0ZWRLZXlzKQogICAgICAgICAgICA6IGRpZmZlcmVuY2Uoc2VsZWN0ZWRLZXlzLCB0cmVlU2VsZWN0ZWRLZXlzKTsKICAgICAgICAgIG9uSXRlbVNlbGVjdEFsbChkaWZmS2V5cywgc2VsZWN0ZWQpOwogICAgICAgIH0sCiAgICAgICAgb25TZWxlY3QoeyBrZXkgfSwgc2VsZWN0ZWQpIHsKICAgICAgICAgIG9uSXRlbVNlbGVjdChrZXksIHNlbGVjdGVkKTsKICAgICAgICB9LAogICAgICAgIHNlbGVjdGVkUm93S2V5czogc2VsZWN0ZWRLZXlzLAogICAgICB9OwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIG1vY2tEYXRhLAogICAgICB0YXJnZXRLZXlzLAogICAgICBkaXNhYmxlZCwKICAgICAgc2hvd1NlYXJjaCwKICAgICAgbGVmdENvbHVtbnMsCiAgICAgIHJpZ2h0Q29sdW1ucywKICAgICAgb25DaGFuZ2UsCiAgICAgIGdldFJvd1NlbGVjdGlvbiwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:k(()=>[n("div",null,[C(e,{"data-source":s.mockData,"target-keys":s.targetKeys,disabled:s.disabled,"show-search":s.showSearch,"filter-option":(d,g)=>g.title.indexOf(d)!==-1,"show-select-all":!1,onChange:s.onChange},{children:k(({direction:d,filteredItems:g,selectedKeys:m,disabled:y,onItemSelectAll:w,onItemSelect:f})=>[C(o,{"row-selection":s.getRowSelection({disabled:y,selectedKeys:m,onItemSelectAll:w,onItemSelect:f}),columns:d==="left"?s.leftColumns:s.rightColumns,"data-source":g,size:"small",style:q({pointerEvents:y?"none":null}),"custom-row":({key:V,disabled:F})=>({onClick:()=>{F||y||f(V,!m.includes(V))}})},null,8,["row-selection","columns","data-source","style","custom-row"])]),_:1},8,["data-source","target-keys","disabled","show-search","filter-option","onChange"]),C(c,{"un-checked-children":"disabled","checked-children":"disabled",checked:s.disabled,"onUpdate:checked":a[0]||(a[0]=d=>s.disabled=d),style:{"margin-top":"16px"}},null,8,["checked"]),C(c,{"un-checked-children":"showSearch","checked-children":"showSearch",checked:s.showSearch,"onUpdate:checked":a[1]||(a[1]=d=>s.showSearch=d),style:{"margin-top":"16px"}},null,8,["checked"])])]),htmlCode:k(()=>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(`
    533. 

  533.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    534. 

  534.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    535. 

  535.       `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("mockData"),n("span",{class:"token punctuation"},'"')]),t(`
    536. 

  536.       `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    537. 

  537.       `),n("span",{class:"token attr-name"},":disabled"),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(`
    538. 

  538.       `),n("span",{class:"token attr-name"},":show-search"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("showSearch"),n("span",{class:"token punctuation"},'"')]),t(`
    539. 

  539.       `),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("(inputValue, item) => item.title.indexOf(inputValue) !== -1"),n("span",{class:"token punctuation"},'"')]),t(`
    540. 

  540.       `),n("span",{class:"token attr-name"},":show-select-all"),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(`
    541. 

  541.       `),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("onChange"),n("span",{class:"token punctuation"},'"')]),t(`
    542. 

  542.     `),n("span",{class:"token punctuation"},">")]),t(`
    543. 

  543.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(`
    544. 

  544.         `),n("span",{class:"token attr-name"},"#children"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`{
    545. 

  545.           direction,
    546. 

  546.           filteredItems,
    547. 

  547.           selectedKeys,
    548. 

  548.           disabled: listDisabled,
    549. 

  549.           onItemSelectAll,
    550. 

  550.           onItemSelect,
    551. 

  551.         }`),n("span",{class:"token punctuation"},'"')]),t(`
    552. 

  552.       `),n("span",{class:"token punctuation"},">")]),t(`
    553. 

  553.         `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-table")]),t(`
    554. 

  554.           `),n("span",{class:"token attr-name"},":row-selection"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`
    555. 

  555.             getRowSelection({
    556. 

  556.               disabled: listDisabled,
    557. 

  557.               selectedKeys,
    558. 

  558.               onItemSelectAll,
    559. 

  559.               onItemSelect,
    560. 

  560.             })
    561. 

  561.           `),n("span",{class:"token punctuation"},'"')]),t(`
    562. 

  562.           `),n("span",{class:"token attr-name"},":columns"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("direction === 'left' ? leftColumns : rightColumns"),n("span",{class:"token punctuation"},'"')]),t(`
    563. 

  563.           `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("filteredItems"),n("span",{class:"token punctuation"},'"')]),t(`
    564. 

  564.           `),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(`
    565. 

  565.           `),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"},'"'),t("{ pointerEvents: listDisabled ? 'none' : null }"),n("span",{class:"token punctuation"},'"')]),t(`
    566. 

  566.           `),n("span",{class:"token attr-name"},":custom-row"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`
    567. 

  567.             ({ key, disabled: itemDisabled }) => ({
    568. 

  568.               onClick: () => {
    569. 

  569.                 if (itemDisabled || listDisabled) return;
    570. 

  570.                 onItemSelect(key, !selectedKeys.includes(key));
    571. 

  571.               },
    572. 

  572.             })
    573. 

  573.           `),n("span",{class:"token punctuation"},'"')]),t(`
    574. 

  574.         `),n("span",{class:"token punctuation"},"/>")]),t(`
    575. 

  575.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    576. 

  576.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-transfer")]),n("span",{class:"token punctuation"},">")]),t(`
    577. 

  577.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-switch")]),t(`
    578. 

  578.       `),n("span",{class:"token attr-name"},"un-checked-children"),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(`
    579. 

  579.       `),n("span",{class:"token attr-name"},"checked-children"),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(`
    580. 

  580.       `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("checked")]),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(`
    581. 

  581.       `),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(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(`
    582. 

  582.     `),n("span",{class:"token punctuation"},"/>")]),t(`
    583. 

  583.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-switch")]),t(`
    584. 

  584.       `),n("span",{class:"token attr-name"},"un-checked-children"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("showSearch"),n("span",{class:"token punctuation"},'"')]),t(`
    585. 

  585.       `),n("span",{class:"token attr-name"},"checked-children"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("showSearch"),n("span",{class:"token punctuation"},'"')]),t(`
    586. 

  586.       `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("showSearch"),n("span",{class:"token punctuation"},'"')]),t(`
    587. 

  587.       `),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(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(`
    588. 

  588.     `),n("span",{class:"token punctuation"},"/>")]),t(`
    589. 

  589.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    590. 

  590. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    591. 

  591. `),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(`
    592. 

  592. `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" difference "),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(`
    593. 

  593. `),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(`
    594. 

  594. `),n("span",{class:"token keyword"},"interface"),t(),n("span",{class:"token class-name"},"MockData"),t(),n("span",{class:"token punctuation"},"{"),t(`
    595. 

  595.   `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    596. 

  596.   `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    597. 

  597.   `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    598. 

  598.   `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(" boolean"),n("span",{class:"token punctuation"},";"),t(`
    599. 

  599. `),n("span",{class:"token punctuation"},"}"),t(`
    600. 

  600. type tableColumn `),n("span",{class:"token operator"},"="),t(" Record"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token punctuation"},","),t(" string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},";"),t(`
    601. 

  601. `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token literal-property property"},"mockData"),n("span",{class:"token operator"},":"),t(" MockData"),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(`
    602. 

  602. `),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"},"20"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    603. 

  603.   mockData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
    604. 

  604.     `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    605. 

  605.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    606. 

  606.     `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"description of content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    607. 

  607.     `),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"},"4"),t(),n("span",{class:"token operator"},"==="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},","),t(`
    608. 

  608.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    609. 

  609. `),n("span",{class:"token punctuation"},"}"),t(`
    610. 

  610. 

  611. `),n("span",{class:"token keyword"},"const"),t(" originTargetKeys "),n("span",{class:"token operator"},"="),t(" mockData"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token operator"},"+"),t("item"),n("span",{class:"token punctuation"},"."),t("key "),n("span",{class:"token operator"},"%"),t(),n("span",{class:"token number"},"3"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"1"),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 parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(" item"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    612. 

  612. 

  613. `),n("span",{class:"token keyword"},"const"),t(" leftTableColumns "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),t(`
    614. 

  614.   `),n("span",{class:"token punctuation"},"{"),t(`
    615. 

  615.     `),n("span",{class:"token literal-property property"},"dataIndex"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'title'"),n("span",{class:"token punctuation"},","),t(`
    616. 

  616.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Name'"),n("span",{class:"token punctuation"},","),t(`
    617. 

  617.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    618. 

  618.   `),n("span",{class:"token punctuation"},"{"),t(`
    619. 

  619.     `),n("span",{class:"token literal-property property"},"dataIndex"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'description'"),n("span",{class:"token punctuation"},","),t(`
    620. 

  620.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Description'"),n("span",{class:"token punctuation"},","),t(`
    621. 

  621.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    622. 

  622. `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    623. 

  623. `),n("span",{class:"token keyword"},"const"),t(" rightTableColumns "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),t(`
    624. 

  624.   `),n("span",{class:"token punctuation"},"{"),t(`
    625. 

  625.     `),n("span",{class:"token literal-property property"},"dataIndex"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'title'"),n("span",{class:"token punctuation"},","),t(`
    626. 

  626.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Name'"),n("span",{class:"token punctuation"},","),t(`
    627. 

  627.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    628. 

  628. `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    629. 

  629. 

  630. `),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(`
    631. 

  631.   `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    632. 

  632.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),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"},"("),t("originTargetKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    633. 

  633.     `),n("span",{class:"token keyword"},"const"),t(" disabled "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    634. 

  634.     `),n("span",{class:"token keyword"},"const"),t(" showSearch "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    635. 

  635.     `),n("span",{class:"token keyword"},"const"),t(" leftColumns "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("tableColumn"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),t("leftTableColumns"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    636. 

  636.     `),n("span",{class:"token keyword"},"const"),t(" rightColumns "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("tableColumn"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),t("rightTableColumns"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    637. 

  637. 

  638.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"nextTargetKeys"),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(`
    639. 

  639.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" nextTargetKeys"),n("span",{class:"token punctuation"},";"),t(`
    640. 

  640.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    641. 

  641. 

  642.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"getRowSelection"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token punctuation"},"{"),t(`
    643. 

  643.       disabled`),n("span",{class:"token punctuation"},","),t(`
    644. 

  644.       selectedKeys`),n("span",{class:"token punctuation"},","),t(`
    645. 

  645.       onItemSelectAll`),n("span",{class:"token punctuation"},","),t(`
    646. 

  646.       onItemSelect`),n("span",{class:"token punctuation"},","),t(`
    647. 

  647.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token operator"},":"),t(" Record"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token punctuation"},","),t(" any"),n("span",{class:"token operator"},">")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    648. 

  648.       `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    649. 

  649.         `),n("span",{class:"token function-variable function"},"getCheckboxProps"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"item"),n("span",{class:"token operator"},":"),t(" Record"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token punctuation"},","),t(" string "),n("span",{class:"token operator"},"|"),t(" boolean"),n("span",{class:"token operator"},">")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
    650. 

  650.           `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(" disabled "),n("span",{class:"token operator"},"||"),t(" item"),n("span",{class:"token punctuation"},"."),t("disabled"),n("span",{class:"token punctuation"},","),t(`
    651. 

  651.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    652. 

  652.         `),n("span",{class:"token function"},"onSelectAll"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"selected"),n("span",{class:"token operator"},":"),t(" boolean"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"selectedRows"),n("span",{class:"token operator"},":"),t(" Record"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token punctuation"},","),t(" string "),n("span",{class:"token operator"},"|"),t(" boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    653. 

  653.           `),n("span",{class:"token keyword"},"const"),t(" treeSelectedKeys "),n("span",{class:"token operator"},"="),t(` selectedRows
    654. 

  654.             `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token operator"},"!"),t("item"),n("span",{class:"token punctuation"},"."),t("disabled"),n("span",{class:"token punctuation"},")"),t(`
    655. 

  655.             `),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"},[n("span",{class:"token punctuation"},"{"),t(" key "),n("span",{class:"token punctuation"},"}")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(" key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    656. 

  656.           `),n("span",{class:"token keyword"},"const"),t(" diffKeys "),n("span",{class:"token operator"},"="),t(` selected
    657. 

  657.             `),n("span",{class:"token operator"},"?"),t(),n("span",{class:"token function"},"difference"),n("span",{class:"token punctuation"},"("),t("treeSelectedKeys"),n("span",{class:"token punctuation"},","),t(" selectedKeys"),n("span",{class:"token punctuation"},")"),t(`
    658. 

  658.             `),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"difference"),n("span",{class:"token punctuation"},"("),t("selectedKeys"),n("span",{class:"token punctuation"},","),t(" treeSelectedKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    659. 

  659.           `),n("span",{class:"token function"},"onItemSelectAll"),n("span",{class:"token punctuation"},"("),t("diffKeys"),n("span",{class:"token punctuation"},","),t(" selected"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    660. 

  660.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    661. 

  661.         `),n("span",{class:"token function"},"onSelect"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token punctuation"},"{"),t(" key "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token operator"},":"),t(" Record"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token punctuation"},","),t(" string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"selected"),n("span",{class:"token operator"},":"),t(" boolean")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    662. 

  662.           `),n("span",{class:"token function"},"onItemSelect"),n("span",{class:"token punctuation"},"("),t("key"),n("span",{class:"token punctuation"},","),t(" selected"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    663. 

  663.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    664. 

  664.         `),n("span",{class:"token literal-property property"},"selectedRowKeys"),n("span",{class:"token operator"},":"),t(" selectedKeys"),n("span",{class:"token punctuation"},","),t(`
    665. 

  665.       `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    666. 

  666.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    667. 

  667.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    668. 

  668.       mockData`),n("span",{class:"token punctuation"},","),t(`
    669. 

  669.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    670. 

  670.       disabled`),n("span",{class:"token punctuation"},","),t(`
    671. 

  671.       showSearch`),n("span",{class:"token punctuation"},","),t(`
    672. 

  672.       leftColumns`),n("span",{class:"token punctuation"},","),t(`
    673. 

  673.       rightColumns`),n("span",{class:"token punctuation"},","),t(`
    674. 

  674.       onChange`),n("span",{class:"token punctuation"},","),t(`
    675. 

  675.       getRowSelection`),n("span",{class:"token punctuation"},","),t(`
    676. 

  676.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    677. 

  677.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    678. 

  678. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    679. 

  679. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    680. 

  680. `)])],-1)])),jsVersionHtml:k(()=>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(`
    681. 

  681.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    682. 

  682.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    683. 

  683.       `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("mockData"),n("span",{class:"token punctuation"},'"')]),t(`
    684. 

  684.       `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    685. 

  685.       `),n("span",{class:"token attr-name"},":disabled"),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(`
    686. 

  686.       `),n("span",{class:"token attr-name"},":show-search"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("showSearch"),n("span",{class:"token punctuation"},'"')]),t(`
    687. 

  687.       `),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("(inputValue, item) => item.title.indexOf(inputValue) !== -1"),n("span",{class:"token punctuation"},'"')]),t(`
    688. 

  688.       `),n("span",{class:"token attr-name"},":show-select-all"),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(`
    689. 

  689.       `),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("onChange"),n("span",{class:"token punctuation"},'"')]),t(`
    690. 

  690.     `),n("span",{class:"token punctuation"},">")]),t(`
    691. 

  691.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(`
    692. 

  692.         `),n("span",{class:"token attr-name"},"#children"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`{
    693. 

  693.           direction,
    694. 

  694.           filteredItems,
    695. 

  695.           selectedKeys,
    696. 

  696.           disabled: listDisabled,
    697. 

  697.           onItemSelectAll,
    698. 

  698.           onItemSelect,
    699. 

  699.         }`),n("span",{class:"token punctuation"},'"')]),t(`
    700. 

  700.       `),n("span",{class:"token punctuation"},">")]),t(`
    701. 

  701.         `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-table")]),t(`
    702. 

  702.           `),n("span",{class:"token attr-name"},":row-selection"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`
    703. 

  703.             getRowSelection({
    704. 

  704.               disabled: listDisabled,
    705. 

  705.               selectedKeys,
    706. 

  706.               onItemSelectAll,
    707. 

  707.               onItemSelect,
    708. 

  708.             })
    709. 

  709.           `),n("span",{class:"token punctuation"},'"')]),t(`
    710. 

  710.           `),n("span",{class:"token attr-name"},":columns"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("direction === 'left' ? leftColumns : rightColumns"),n("span",{class:"token punctuation"},'"')]),t(`
    711. 

  711.           `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("filteredItems"),n("span",{class:"token punctuation"},'"')]),t(`
    712. 

  712.           `),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(`
    713. 

  713.           `),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"},'"'),t("{ pointerEvents: listDisabled ? 'none' : null }"),n("span",{class:"token punctuation"},'"')]),t(`
    714. 

  714.           `),n("span",{class:"token attr-name"},":custom-row"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`
    715. 

  715.             ({ key, disabled: itemDisabled }) => ({
    716. 

  716.               onClick: () => {
    717. 

  717.                 if (itemDisabled || listDisabled) return;
    718. 

  718.                 onItemSelect(key, !selectedKeys.includes(key));
    719. 

  719.               },
    720. 

  720.             })
    721. 

  721.           `),n("span",{class:"token punctuation"},'"')]),t(`
    722. 

  722.         `),n("span",{class:"token punctuation"},"/>")]),t(`
    723. 

  723.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    724. 

  724.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-transfer")]),n("span",{class:"token punctuation"},">")]),t(`
    725. 

  725.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-switch")]),t(`
    726. 

  726.       `),n("span",{class:"token attr-name"},"un-checked-children"),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(`
    727. 

  727.       `),n("span",{class:"token attr-name"},"checked-children"),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(`
    728. 

  728.       `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("checked")]),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(`
    729. 

  729.       `),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(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(`
    730. 

  730.     `),n("span",{class:"token punctuation"},"/>")]),t(`
    731. 

  731.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-switch")]),t(`
    732. 

  732.       `),n("span",{class:"token attr-name"},"un-checked-children"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("showSearch"),n("span",{class:"token punctuation"},'"')]),t(`
    733. 

  733.       `),n("span",{class:"token attr-name"},"checked-children"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("showSearch"),n("span",{class:"token punctuation"},'"')]),t(`
    734. 

  734.       `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("showSearch"),n("span",{class:"token punctuation"},'"')]),t(`
    735. 

  735.       `),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(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(`
    736. 

  736.     `),n("span",{class:"token punctuation"},"/>")]),t(`
    737. 

  737.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    738. 

  738. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    739. 

  739. `),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(`
    740. 

  740. `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" difference "),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(`
    741. 

  741. `),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(`
    742. 

  742. `),n("span",{class:"token keyword"},"const"),t(" mockData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    743. 

  743. `),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"},"20"),n("span",{class:"token punctuation"},";"),t(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    744. 

  744.   mockData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
    745. 

  745.     `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" i"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    746. 

  746.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    747. 

  747.     `),n("span",{class:"token literal-property property"},"description"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"description of content"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("i "),n("span",{class:"token operator"},"+"),t(),n("span",{class:"token number"},"1"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),t(`
    748. 

  748.     `),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"},"4"),t(),n("span",{class:"token operator"},"==="),t(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},","),t(`
    749. 

  749.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    750. 

  750. `),n("span",{class:"token punctuation"},"}"),t(`
    751. 

  751. `),n("span",{class:"token keyword"},"const"),t(" originTargetKeys "),n("span",{class:"token operator"},"="),t(" mockData"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token operator"},"+"),t("item"),n("span",{class:"token punctuation"},"."),t("key "),n("span",{class:"token operator"},"%"),t(),n("span",{class:"token number"},"3"),t(),n("span",{class:"token operator"},">"),t(),n("span",{class:"token number"},"1"),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 parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(" item"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    752. 

  752. `),n("span",{class:"token keyword"},"const"),t(" leftTableColumns "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),t(`
    753. 

  753.   `),n("span",{class:"token punctuation"},"{"),t(`
    754. 

  754.     `),n("span",{class:"token literal-property property"},"dataIndex"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'title'"),n("span",{class:"token punctuation"},","),t(`
    755. 

  755.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Name'"),n("span",{class:"token punctuation"},","),t(`
    756. 

  756.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    757. 

  757.   `),n("span",{class:"token punctuation"},"{"),t(`
    758. 

  758.     `),n("span",{class:"token literal-property property"},"dataIndex"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'description'"),n("span",{class:"token punctuation"},","),t(`
    759. 

  759.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Description'"),n("span",{class:"token punctuation"},","),t(`
    760. 

  760.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    761. 

  761. `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    762. 

  762. `),n("span",{class:"token keyword"},"const"),t(" rightTableColumns "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),t(`
    763. 

  763.   `),n("span",{class:"token punctuation"},"{"),t(`
    764. 

  764.     `),n("span",{class:"token literal-property property"},"dataIndex"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'title'"),n("span",{class:"token punctuation"},","),t(`
    765. 

  765.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Name'"),n("span",{class:"token punctuation"},","),t(`
    766. 

  766.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    767. 

  767. `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    768. 

  768. `),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(`
    769. 

  769.   `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    770. 

  770.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),t("originTargetKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    771. 

  771.     `),n("span",{class:"token keyword"},"const"),t(" disabled "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    772. 

  772.     `),n("span",{class:"token keyword"},"const"),t(" showSearch "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    773. 

  773.     `),n("span",{class:"token keyword"},"const"),t(" leftColumns "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),t("leftTableColumns"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    774. 

  774.     `),n("span",{class:"token keyword"},"const"),t(" rightColumns "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),t("rightTableColumns"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    775. 

  775.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"nextTargetKeys"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    776. 

  776.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" nextTargetKeys"),n("span",{class:"token punctuation"},";"),t(`
    777. 

  777.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    778. 

  778.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"getRowSelection"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token punctuation"},"{"),t(" disabled"),n("span",{class:"token punctuation"},","),t(" selectedKeys"),n("span",{class:"token punctuation"},","),t(" onItemSelectAll"),n("span",{class:"token punctuation"},","),t(" onItemSelect "),n("span",{class:"token punctuation"},"}")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    779. 

  779.       `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    780. 

  780.         `),n("span",{class:"token function-variable function"},"getCheckboxProps"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
    781. 

  781.           `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),t(" disabled "),n("span",{class:"token operator"},"||"),t(" item"),n("span",{class:"token punctuation"},"."),t("disabled"),n("span",{class:"token punctuation"},","),t(`
    782. 

  782.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
    783. 

  783.         `),n("span",{class:"token function"},"onSelectAll"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("selected"),n("span",{class:"token punctuation"},","),t(" selectedRows")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    784. 

  784.           `),n("span",{class:"token keyword"},"const"),t(" treeSelectedKeys "),n("span",{class:"token operator"},"="),t(` selectedRows
    785. 

  785.             `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token operator"},"!"),t("item"),n("span",{class:"token punctuation"},"."),t("disabled"),n("span",{class:"token punctuation"},")"),t(`
    786. 

  786.             `),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"},[n("span",{class:"token punctuation"},"{"),t(" key "),n("span",{class:"token punctuation"},"}")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(" key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    787. 

  787.           `),n("span",{class:"token keyword"},"const"),t(" diffKeys "),n("span",{class:"token operator"},"="),t(` selected
    788. 

  788.             `),n("span",{class:"token operator"},"?"),t(),n("span",{class:"token function"},"difference"),n("span",{class:"token punctuation"},"("),t("treeSelectedKeys"),n("span",{class:"token punctuation"},","),t(" selectedKeys"),n("span",{class:"token punctuation"},")"),t(`
    789. 

  789.             `),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"difference"),n("span",{class:"token punctuation"},"("),t("selectedKeys"),n("span",{class:"token punctuation"},","),t(" treeSelectedKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    790. 

  790.           `),n("span",{class:"token function"},"onItemSelectAll"),n("span",{class:"token punctuation"},"("),t("diffKeys"),n("span",{class:"token punctuation"},","),t(" selected"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    791. 

  791.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    792. 

  792.         `),n("span",{class:"token function"},"onSelect"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token punctuation"},"{"),t(" key "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(" selected")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    793. 

  793.           `),n("span",{class:"token function"},"onItemSelect"),n("span",{class:"token punctuation"},"("),t("key"),n("span",{class:"token punctuation"},","),t(" selected"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    794. 

  794.         `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    795. 

  795.         `),n("span",{class:"token literal-property property"},"selectedRowKeys"),n("span",{class:"token operator"},":"),t(" selectedKeys"),n("span",{class:"token punctuation"},","),t(`
    796. 

  796.       `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    797. 

  797.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    798. 

  798.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    799. 

  799.       mockData`),n("span",{class:"token punctuation"},","),t(`
    800. 

  800.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    801. 

  801.       disabled`),n("span",{class:"token punctuation"},","),t(`
    802. 

  802.       showSearch`),n("span",{class:"token punctuation"},","),t(`
    803. 

  803.       leftColumns`),n("span",{class:"token punctuation"},","),t(`
    804. 

  804.       rightColumns`),n("span",{class:"token punctuation"},","),t(`
    805. 

  805.       onChange`),n("span",{class:"token punctuation"},","),t(`
    806. 

  806.       getRowSelection`),n("span",{class:"token punctuation"},","),t(`
    807. 

  807.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    808. 

  808.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    809. 

  809. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    810. 

  810. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    811. 

  811. `)])],-1)])),_:1})}var hn=b(mn,[["render",yn]]);const N=[{key:"0-0",title:"0-0"},{key:"0-1",title:"0-1",children:[{key:"0-1-0",title:"0-1-0"},{key:"0-1-1",title:"0-1-1"}]},{key:"0-2",title:"0-3"}],D=[];function H(s=[]){s.forEach(a=>{D.push(a),H(a.children)})}H(JSON.parse(JSON.stringify(N)));function bn(s,a){return s.indexOf(a)!==-1}function z(s,a=[]){return s.forEach(p=>{p.disabled=a.includes(p.key),p.children&&z(p.children,a)}),s}const Zn=G({setup(){const s=A([]),a=A(D),p=Q(()=>z(N,s.value));return{targetKeys:s,dataSource:a,treeData:p,onChange:u=>{s.value=u},onChecked:(u,o,e,c)=>{const{eventKey:i}=o.node;c(i,!bn(e,i))}}}});function Gn(s,a,p,I,l,u){const o=r("a-tree"),e=r("a-transfer"),c=r("demo-box");return h(),Z(c,{jsfiddle:{us:"Customize render list with Tree component.",cn:"\u4F7F\u7528 Tree \u7EC4\u4EF6\u4F5C\u4E3A\u81EA\u5B9A\u4E49\u6E32\u67D3\u5217\u8868\u3002",docHtml:`<h2 id="zh-cn">zh-CN</h2>
    812. 

  812. <p>\u4F7F\u7528 Tree \u7EC4\u4EF6\u4F5C\u4E3A\u81EA\u5B9A\u4E49\u6E32\u67D3\u5217\u8868\u3002</p>
    813. 

  813. <h2 id="en-us">en-US</h2>
    814. 

  814. <p>Customize render list with Tree component.</p>
    815. 

  815. `,order:5,title:{"zh-CN":"\u6811\u7A7F\u68AD\u6846","en-US":"Tree Transfer"},relativePath:"src/docs/transfer/demo/tree-transfer.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS10cmFuc2ZlcgogICAgICBjbGFzcz0idHJlZS10cmFuc2ZlciIKICAgICAgOmRhdGEtc291cmNlPSJkYXRhU291cmNlIgogICAgICA6dGFyZ2V0LWtleXM9InRhcmdldEtleXMiCiAgICAgIDpyZW5kZXI9Iml0ZW0gPT4gaXRlbS50aXRsZSIKICAgICAgOnNob3ctc2VsZWN0LWFsbD0iZmFsc2UiCiAgICAgIEBjaGFuZ2U9Im9uQ2hhbmdlIgogICAgPgogICAgICA8dGVtcGxhdGUgI2NoaWxkcmVuPSJ7IGRpcmVjdGlvbiwgc2VsZWN0ZWRLZXlzLCBvbkl0ZW1TZWxlY3QgfSI+CiAgICAgICAgPGEtdHJlZQogICAgICAgICAgdi1pZj0iZGlyZWN0aW9uID09PSAnbGVmdCciCiAgICAgICAgICBibG9ja05vZGUKICAgICAgICAgIGNoZWNrYWJsZQogICAgICAgICAgY2hlY2tTdHJpY3RseQogICAgICAgICAgZGVmYXVsdEV4cGFuZEFsbAogICAgICAgICAgOmNoZWNrZWRLZXlzPSJbLi4uc2VsZWN0ZWRLZXlzLCAuLi50YXJnZXRLZXlzXSIKICAgICAgICAgIDp0cmVlRGF0YT0idHJlZURhdGEiCiAgICAgICAgICBAY2hlY2s9IgogICAgICAgICAgICAoXywgcHJvcHMpID0+IHsKICAgICAgICAgICAgICBvbkNoZWNrZWQoXywgcHJvcHMsIFsuLi5zZWxlY3RlZEtleXMsIC4uLnRhcmdldEtleXNdLCBvbkl0ZW1TZWxlY3QpOwogICAgICAgICAgICB9CiAgICAgICAgICAiCiAgICAgICAgICBAc2VsZWN0PSIKICAgICAgICAgICAgKF8sIHByb3BzKSA9PiB7CiAgICAgICAgICAgICAgb25DaGVja2VkKF8sIHByb3BzLCBbLi4uc2VsZWN0ZWRLZXlzLCAuLi50YXJnZXRLZXlzXSwgb25JdGVtU2VsZWN0KTsKICAgICAgICAgICAgfQogICAgICAgICAgIgogICAgICAgIC8+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2EtdHJhbnNmZXI+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBDaGVja0V2ZW50IH0gZnJvbSAnYW50LWRlc2lnbi12dWUvZXMvdHJlZS9UcmVlJzsKaW1wb3J0IHsgY29tcHV0ZWQsIGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKaW50ZXJmYWNlIFRyZWVEYXRhSXRlbSB7CiAga2V5OiBzdHJpbmc7CiAgdGl0bGU6IHN0cmluZzsKICBkaXNhYmxlZD86IGJvb2xlYW47CiAgY2hpbGRyZW4/OiBUcmVlRGF0YUl0ZW1bXTsKfQpjb25zdCB0RGF0YTogVHJlZURhdGFJdGVtW10gPSBbCiAgeyBrZXk6ICcwLTAnLCB0aXRsZTogJzAtMCcgfSwKICB7CiAgICBrZXk6ICcwLTEnLAogICAgdGl0bGU6ICcwLTEnLAogICAgY2hpbGRyZW46IFsKICAgICAgeyBrZXk6ICcwLTEtMCcsIHRpdGxlOiAnMC0xLTAnIH0sCiAgICAgIHsga2V5OiAnMC0xLTEnLCB0aXRsZTogJzAtMS0xJyB9LAogICAgXSwKICB9LAogIHsga2V5OiAnMC0yJywgdGl0bGU6ICcwLTMnIH0sCl07Cgpjb25zdCB0cmFuc2ZlckRhdGFTb3VyY2U6IFRyZWVEYXRhSXRlbVtdID0gW107CmZ1bmN0aW9uIGZsYXR0ZW4obGlzdDogVHJlZURhdGFJdGVtW10gPSBbXSkgewogIGxpc3QuZm9yRWFjaChpdGVtID0+IHsKICAgIHRyYW5zZmVyRGF0YVNvdXJjZS5wdXNoKGl0ZW0pOwogICAgZmxhdHRlbihpdGVtLmNoaWxkcmVuKTsKICB9KTsKfQpmbGF0dGVuKEpTT04ucGFyc2UoSlNPTi5zdHJpbmdpZnkodERhdGEpKSk7CgpmdW5jdGlvbiBpc0NoZWNrZWQoc2VsZWN0ZWRLZXlzOiBzdHJpbmdbXSwgZXZlbnRLZXk6IHN0cmluZykgewogIHJldHVybiBzZWxlY3RlZEtleXMuaW5kZXhPZihldmVudEtleSkgIT09IC0xOwp9CgpmdW5jdGlvbiBoYW5kbGVUcmVlRGF0YShkYXRhOiBUcmVlRGF0YUl0ZW1bXSwgdGFyZ2V0S2V5czogc3RyaW5nW10gPSBbXSk6IFRyZWVEYXRhSXRlbVtdIHsKICBkYXRhLmZvckVhY2goaXRlbSA9PiB7CiAgICBpdGVtWydkaXNhYmxlZCddID0gdGFyZ2V0S2V5cy5pbmNsdWRlcyhpdGVtLmtleSk7CiAgICBpZiAoaXRlbS5jaGlsZHJlbikgewogICAgICBoYW5kbGVUcmVlRGF0YShpdGVtLmNoaWxkcmVuLCB0YXJnZXRLZXlzKTsKICAgIH0KICB9KTsKICByZXR1cm4gZGF0YTsKfQoKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHRhcmdldEtleXMgPSByZWY8c3RyaW5nW10+KFtdKTsKCiAgICBjb25zdCBkYXRhU291cmNlID0gcmVmPFRyZWVEYXRhSXRlbVtdPih0cmFuc2ZlckRhdGFTb3VyY2UpOwoKICAgIGNvbnN0IHRyZWVEYXRhID0gY29tcHV0ZWQ8VHJlZURhdGFJdGVtW10+KCgpID0+IHsKICAgICAgcmV0dXJuIGhhbmRsZVRyZWVEYXRhKHREYXRhLCB0YXJnZXRLZXlzLnZhbHVlKTsKICAgIH0pOwoKICAgIGNvbnN0IG9uQ2hhbmdlID0gKGtleXM6IHN0cmluZ1tdKSA9PiB7CiAgICAgIHRhcmdldEtleXMudmFsdWUgPSBrZXlzOwogICAgfTsKICAgIGNvbnN0IG9uQ2hlY2tlZCA9ICgKICAgICAgXzogUmVjb3JkPHN0cmluZywgc3RyaW5nW10+LAogICAgICBlOiBDaGVja0V2ZW50LAogICAgICBjaGVja2VkS2V5czogc3RyaW5nW10sCiAgICAgIG9uSXRlbVNlbGVjdDogKG46IGFueSwgYzogYm9vbGVhbikgPT4gdm9pZCwKICAgICkgPT4gewogICAgICBjb25zdCB7IGV2ZW50S2V5IH0gPSBlLm5vZGU7CiAgICAgIG9uSXRlbVNlbGVjdChldmVudEtleSwgIWlzQ2hlY2tlZChjaGVja2VkS2V5cywgZXZlbnRLZXkpKTsKICAgIH07CiAgICByZXR1cm4gewogICAgICB0YXJnZXRLZXlzLAogICAgICBkYXRhU291cmNlLAogICAgICB0cmVlRGF0YSwKICAgICAgb25DaGFuZ2UsCiAgICAgIG9uQ2hlY2tlZCwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pgo8c3R5bGUgc2NvcGVkPgoudHJlZS10cmFuc2ZlciAuYW50LXRyYW5zZmVyLWxpc3Q6Zmlyc3QtY2hpbGQgewogIHdpZHRoOiA1MCU7CiAgZmxleDogbm9uZTsKfQo8L3N0eWxlPgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS10cmFuc2ZlcgogICAgICBjbGFzcz0idHJlZS10cmFuc2ZlciIKICAgICAgOmRhdGEtc291cmNlPSJkYXRhU291cmNlIgogICAgICA6dGFyZ2V0LWtleXM9InRhcmdldEtleXMiCiAgICAgIDpyZW5kZXI9Iml0ZW0gPT4gaXRlbS50aXRsZSIKICAgICAgOnNob3ctc2VsZWN0LWFsbD0iZmFsc2UiCiAgICAgIEBjaGFuZ2U9Im9uQ2hhbmdlIgogICAgPgogICAgICA8dGVtcGxhdGUgI2NoaWxkcmVuPSJ7IGRpcmVjdGlvbiwgc2VsZWN0ZWRLZXlzLCBvbkl0ZW1TZWxlY3QgfSI+CiAgICAgICAgPGEtdHJlZQogICAgICAgICAgdi1pZj0iZGlyZWN0aW9uID09PSAnbGVmdCciCiAgICAgICAgICBibG9ja05vZGUKICAgICAgICAgIGNoZWNrYWJsZQogICAgICAgICAgY2hlY2tTdHJpY3RseQogICAgICAgICAgZGVmYXVsdEV4cGFuZEFsbAogICAgICAgICAgOmNoZWNrZWRLZXlzPSJbLi4uc2VsZWN0ZWRLZXlzLCAuLi50YXJnZXRLZXlzXSIKICAgICAgICAgIDp0cmVlRGF0YT0idHJlZURhdGEiCiAgICAgICAgICBAY2hlY2s9IgogICAgICAgICAgICAoXywgcHJvcHMpID0+IHsKICAgICAgICAgICAgICBvbkNoZWNrZWQoXywgcHJvcHMsIFsuLi5zZWxlY3RlZEtleXMsIC4uLnRhcmdldEtleXNdLCBvbkl0ZW1TZWxlY3QpOwogICAgICAgICAgICB9CiAgICAgICAgICAiCiAgICAgICAgICBAc2VsZWN0PSIKICAgICAgICAgICAgKF8sIHByb3BzKSA9PiB7CiAgICAgICAgICAgICAgb25DaGVja2VkKF8sIHByb3BzLCBbLi4uc2VsZWN0ZWRLZXlzLCAuLi50YXJnZXRLZXlzXSwgb25JdGVtU2VsZWN0KTsKICAgICAgICAgICAgfQogICAgICAgICAgIgogICAgICAgIC8+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2EtdHJhbnNmZXI+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGNvbXB1dGVkLCBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmNvbnN0IHREYXRhID0gWwogIHsKICAgIGtleTogJzAtMCcsCiAgICB0aXRsZTogJzAtMCcsCiAgfSwKICB7CiAgICBrZXk6ICcwLTEnLAogICAgdGl0bGU6ICcwLTEnLAogICAgY2hpbGRyZW46IFsKICAgICAgewogICAgICAgIGtleTogJzAtMS0wJywKICAgICAgICB0aXRsZTogJzAtMS0wJywKICAgICAgfSwKICAgICAgewogICAgICAgIGtleTogJzAtMS0xJywKICAgICAgICB0aXRsZTogJzAtMS0xJywKICAgICAgfSwKICAgIF0sCiAgfSwKICB7CiAgICBrZXk6ICcwLTInLAogICAgdGl0bGU6ICcwLTMnLAogIH0sCl07CmNvbnN0IHRyYW5zZmVyRGF0YVNvdXJjZSA9IFtdOwpmdW5jdGlvbiBmbGF0dGVuKGxpc3QgPSBbXSkgewogIGxpc3QuZm9yRWFjaChpdGVtID0+IHsKICAgIHRyYW5zZmVyRGF0YVNvdXJjZS5wdXNoKGl0ZW0pOwogICAgZmxhdHRlbihpdGVtLmNoaWxkcmVuKTsKICB9KTsKfQpmbGF0dGVuKEpTT04ucGFyc2UoSlNPTi5zdHJpbmdpZnkodERhdGEpKSk7CmZ1bmN0aW9uIGlzQ2hlY2tlZChzZWxlY3RlZEtleXMsIGV2ZW50S2V5KSB7CiAgcmV0dXJuIHNlbGVjdGVkS2V5cy5pbmRleE9mKGV2ZW50S2V5KSAhPT0gLTE7Cn0KZnVuY3Rpb24gaGFuZGxlVHJlZURhdGEoZGF0YSwgdGFyZ2V0S2V5cyA9IFtdKSB7CiAgZGF0YS5mb3JFYWNoKGl0ZW0gPT4gewogICAgaXRlbVsnZGlzYWJsZWQnXSA9IHRhcmdldEtleXMuaW5jbHVkZXMoaXRlbS5rZXkpOwogICAgaWYgKGl0ZW0uY2hpbGRyZW4pIHsKICAgICAgaGFuZGxlVHJlZURhdGEoaXRlbS5jaGlsZHJlbiwgdGFyZ2V0S2V5cyk7CiAgICB9CiAgfSk7CiAgcmV0dXJuIGRhdGE7Cn0KZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHRhcmdldEtleXMgPSByZWYoW10pOwogICAgY29uc3QgZGF0YVNvdXJjZSA9IHJlZih0cmFuc2ZlckRhdGFTb3VyY2UpOwogICAgY29uc3QgdHJlZURhdGEgPSBjb21wdXRlZCgoKSA9PiB7CiAgICAgIHJldHVybiBoYW5kbGVUcmVlRGF0YSh0RGF0YSwgdGFyZ2V0S2V5cy52YWx1ZSk7CiAgICB9KTsKICAgIGNvbnN0IG9uQ2hhbmdlID0ga2V5cyA9PiB7CiAgICAgIHRhcmdldEtleXMudmFsdWUgPSBrZXlzOwogICAgfTsKICAgIGNvbnN0IG9uQ2hlY2tlZCA9IChfLCBlLCBjaGVja2VkS2V5cywgb25JdGVtU2VsZWN0KSA9PiB7CiAgICAgIGNvbnN0IHsgZXZlbnRLZXkgfSA9IGUubm9kZTsKICAgICAgb25JdGVtU2VsZWN0KGV2ZW50S2V5LCAhaXNDaGVja2VkKGNoZWNrZWRLZXlzLCBldmVudEtleSkpOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHRhcmdldEtleXMsCiAgICAgIGRhdGFTb3VyY2UsCiAgICAgIHRyZWVEYXRhLAogICAgICBvbkNoYW5nZSwKICAgICAgb25DaGVja2VkLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZSBzY29wZWQ+Ci50cmVlLXRyYW5zZmVyIC5hbnQtdHJhbnNmZXItbGlzdDpmaXJzdC1jaGlsZCB7CiAgd2lkdGg6IDUwJTsKICBmbGV4OiBub25lOwp9Cjwvc3R5bGU+"}},{default:k(()=>[n("div",null,[C(e,{class:"tree-transfer","data-source":s.dataSource,"target-keys":s.targetKeys,render:i=>i.title,"show-select-all":!1,onChange:s.onChange},{children:k(({direction:i,selectedKeys:d,onItemSelect:g})=>[i==="left"?(h(),Z(o,{key:0,blockNode:"",checkable:"",checkStrictly:"",defaultExpandAll:"",checkedKeys:[...d,...s.targetKeys],treeData:s.treeData,onCheck:(m,y)=>{s.onChecked(m,y,[...d,...s.targetKeys],g)},onSelect:(m,y)=>{s.onChecked(m,y,[...d,...s.targetKeys],g)}},null,8,["checkedKeys","treeData","onCheck","onSelect"])):M("",!0)]),_:1},8,["data-source","target-keys","render","onChange"])])]),htmlCode:k(()=>a[0]||(a[0]=[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(`
    816. 

  816.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    817. 

  817.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    818. 

  818.       `),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("tree-transfer"),n("span",{class:"token punctuation"},'"')]),t(`
    819. 

  819.       `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("dataSource"),n("span",{class:"token punctuation"},'"')]),t(`
    820. 

  820.       `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    821. 

  821.       `),n("span",{class:"token attr-name"},":render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("item => item.title"),n("span",{class:"token punctuation"},'"')]),t(`
    822. 

  822.       `),n("span",{class:"token attr-name"},":show-select-all"),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(`
    823. 

  823.       `),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("onChange"),n("span",{class:"token punctuation"},'"')]),t(`
    824. 

  824.     `),n("span",{class:"token punctuation"},">")]),t(`
    825. 

  825.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#children"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ direction, selectedKeys, onItemSelect }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    826. 

  826.         `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-tree")]),t(`
    827. 

  827.           `),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("direction === 'left'"),n("span",{class:"token punctuation"},'"')]),t(`
    828. 

  828.           `),n("span",{class:"token attr-name"},"blockNode"),t(`
    829. 

  829.           `),n("span",{class:"token attr-name"},"checkable"),t(`
    830. 

  830.           `),n("span",{class:"token attr-name"},"checkStrictly"),t(`
    831. 

  831.           `),n("span",{class:"token attr-name"},"defaultExpandAll"),t(`
    832. 

  832.           `),n("span",{class:"token attr-name"},":checkedKeys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("[...selectedKeys, ...targetKeys]"),n("span",{class:"token punctuation"},'"')]),t(`
    833. 

  833.           `),n("span",{class:"token attr-name"},":treeData"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("treeData"),n("span",{class:"token punctuation"},'"')]),t(`
    834. 

  834.           `),n("span",{class:"token attr-name"},"@check"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`
    835. 

  835.             (_, props) => {
    836. 

  836.               onChecked(_, props, [...selectedKeys, ...targetKeys], onItemSelect);
    837. 

  837.             }
    838. 

  838.           `),n("span",{class:"token punctuation"},'"')]),t(`
    839. 

  839.           `),n("span",{class:"token attr-name"},"@select"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`
    840. 

  840.             (_, props) => {
    841. 

  841.               onChecked(_, props, [...selectedKeys, ...targetKeys], onItemSelect);
    842. 

  842.             }
    843. 

  843.           `),n("span",{class:"token punctuation"},'"')]),t(`
    844. 

  844.         `),n("span",{class:"token punctuation"},"/>")]),t(`
    845. 

  845.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    846. 

  846.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-transfer")]),n("span",{class:"token punctuation"},">")]),t(`
    847. 

  847.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    848. 

  848. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    849. 

  849. `),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(`
    850. 

  850. `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" CheckEvent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue/es/tree/Tree'"),n("span",{class:"token punctuation"},";"),t(`
    851. 

  851. `),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(`
    852. 

  852. `),n("span",{class:"token keyword"},"interface"),t(),n("span",{class:"token class-name"},"TreeDataItem"),t(),n("span",{class:"token punctuation"},"{"),t(`
    853. 

  853.   `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    854. 

  854.   `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(`
    855. 

  855.   disabled`),n("span",{class:"token operator"},"?"),n("span",{class:"token operator"},":"),t(" boolean"),n("span",{class:"token punctuation"},";"),t(`
    856. 

  856.   children`),n("span",{class:"token operator"},"?"),n("span",{class:"token operator"},":"),t(" TreeDataItem"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    857. 

  857. `),n("span",{class:"token punctuation"},"}"),t(`
    858. 

  858. `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token literal-property property"},"tData"),n("span",{class:"token operator"},":"),t(" TreeDataItem"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),t(`
    859. 

  859.   `),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-0'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-0'"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    860. 

  860.   `),n("span",{class:"token punctuation"},"{"),t(`
    861. 

  861.     `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1'"),n("span",{class:"token punctuation"},","),t(`
    862. 

  862.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1'"),n("span",{class:"token punctuation"},","),t(`
    863. 

  863.     `),n("span",{class:"token literal-property property"},"children"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),t(`
    864. 

  864.       `),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1-0'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1-0'"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    865. 

  865.       `),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1-1'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1-1'"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    866. 

  866.     `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
    867. 

  867.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    868. 

  868.   `),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-2'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-3'"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    869. 

  869. `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    870. 

  870. 

  871. `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token literal-property property"},"transferDataSource"),n("span",{class:"token operator"},":"),t(" TreeDataItem"),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(`
    872. 

  872. `),n("span",{class:"token keyword"},"function"),t(),n("span",{class:"token function"},"flatten"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"list"),n("span",{class:"token operator"},":"),t(" TreeDataItem"),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 punctuation"},"{"),t(`
    873. 

  873.   list`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    874. 

  874.     transferDataSource`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("item"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    875. 

  875.     `),n("span",{class:"token function"},"flatten"),n("span",{class:"token punctuation"},"("),t("item"),n("span",{class:"token punctuation"},"."),t("children"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    876. 

  876.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    877. 

  877. `),n("span",{class:"token punctuation"},"}"),t(`
    878. 

  878. `),n("span",{class:"token function"},"flatten"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"stringify"),n("span",{class:"token punctuation"},"("),t("tData"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    879. 

  879. 

  880. `),n("span",{class:"token keyword"},"function"),t(),n("span",{class:"token function"},"isChecked"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"selectedKeys"),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 literal-property property"},"eventKey"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    881. 

  881.   `),n("span",{class:"token keyword"},"return"),t(" selectedKeys"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"indexOf"),n("span",{class:"token punctuation"},"("),t("eventKey"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"!=="),t(),n("span",{class:"token operator"},"-"),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),t(`
    882. 

  882. `),n("span",{class:"token punctuation"},"}"),t(`
    883. 

  883. 

  884. `),n("span",{class:"token keyword"},"function"),t(),n("span",{class:"token function"},"handleTreeData"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"data"),n("span",{class:"token operator"},":"),t(" TreeDataItem"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"targetKeys"),n("span",{class:"token operator"},":"),t(" string"),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"},")"),n("span",{class:"token operator"},":"),t(" TreeDataItem"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),t(),n("span",{class:"token punctuation"},"{"),t(`
    885. 

  885.   data`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    886. 

  886.     item`),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'disabled'"),n("span",{class:"token punctuation"},"]"),t(),n("span",{class:"token operator"},"="),t(" targetKeys"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"includes"),n("span",{class:"token punctuation"},"("),t("item"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    887. 

  887.     `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("item"),n("span",{class:"token punctuation"},"."),t("children"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    888. 

  888.       `),n("span",{class:"token function"},"handleTreeData"),n("span",{class:"token punctuation"},"("),t("item"),n("span",{class:"token punctuation"},"."),t("children"),n("span",{class:"token punctuation"},","),t(" targetKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    889. 

  889.     `),n("span",{class:"token punctuation"},"}"),t(`
    890. 

  890.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    891. 

  891.   `),n("span",{class:"token keyword"},"return"),t(" data"),n("span",{class:"token punctuation"},";"),t(`
    892. 

  892. `),n("span",{class:"token punctuation"},"}"),t(`
    893. 

  893. 

  894. `),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(`
    895. 

  895.   `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    896. 

  896.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),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(`
    897. 

  897. 

  898.     `),n("span",{class:"token keyword"},"const"),t(" dataSource "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("TreeDataItem"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),t("transferDataSource"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    899. 

  899. 

  900.     `),n("span",{class:"token keyword"},"const"),t(" treeData "),n("span",{class:"token operator"},"="),t(" computed"),n("span",{class:"token operator"},"<"),t("TreeDataItem"),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"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    901. 

  901.       `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token function"},"handleTreeData"),n("span",{class:"token punctuation"},"("),t("tData"),n("span",{class:"token punctuation"},","),t(" targetKeys"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    902. 

  902.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    903. 

  903. 

  904.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"keys"),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(`
    905. 

  905.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    906. 

  906.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    907. 

  907.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onChecked"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),t(`
    908. 

  908.       `),n("span",{class:"token literal-property property"},"_"),n("span",{class:"token operator"},":"),t(" Record"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token punctuation"},","),t(" string"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},","),t(`
    909. 

  909.       `),n("span",{class:"token literal-property property"},"e"),n("span",{class:"token operator"},":"),t(" CheckEvent"),n("span",{class:"token punctuation"},","),t(`
    910. 

  910.       `),n("span",{class:"token literal-property property"},"checkedKeys"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
    911. 

  911.       `),n("span",{class:"token function-variable function"},"onItemSelect"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"n"),n("span",{class:"token operator"},":"),t(" any"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"c"),n("span",{class:"token operator"},":"),t(" boolean")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token keyword"},"void"),n("span",{class:"token punctuation"},","),t(`
    912. 

  912.     `),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    913. 

  913.       `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token punctuation"},"{"),t(" eventKey "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token operator"},"="),t(" e"),n("span",{class:"token punctuation"},"."),t("node"),n("span",{class:"token punctuation"},";"),t(`
    914. 

  914.       `),n("span",{class:"token function"},"onItemSelect"),n("span",{class:"token punctuation"},"("),t("eventKey"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token operator"},"!"),n("span",{class:"token function"},"isChecked"),n("span",{class:"token punctuation"},"("),t("checkedKeys"),n("span",{class:"token punctuation"},","),t(" eventKey"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    915. 

  915.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    916. 

  916.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    917. 

  917.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    918. 

  918.       dataSource`),n("span",{class:"token punctuation"},","),t(`
    919. 

  919.       treeData`),n("span",{class:"token punctuation"},","),t(`
    920. 

  920.       onChange`),n("span",{class:"token punctuation"},","),t(`
    921. 

  921.       onChecked`),n("span",{class:"token punctuation"},","),t(`
    922. 

  922.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    923. 

  923.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    924. 

  924. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    925. 

  925. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    926. 

  926. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("style")]),t(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[t(`
    927. 

  927. `),n("span",{class:"token selector"},".tree-transfer .ant-transfer-list:first-child"),t(),n("span",{class:"token punctuation"},"{"),t(`
    928. 

  928.   `),n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 50%"),n("span",{class:"token punctuation"},";"),t(`
    929. 

  929.   `),n("span",{class:"token property"},"flex"),n("span",{class:"token punctuation"},":"),t(" none"),n("span",{class:"token punctuation"},";"),t(`
    930. 

  930. `),n("span",{class:"token punctuation"},"}"),t(`
    931. 

  931. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("style")]),n("span",{class:"token punctuation"},">")]),t(`
    932. 

  932. `)])],-1)])),jsVersionHtml:k(()=>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(`
    933. 

  933.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    934. 

  934.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-transfer")]),t(`
    935. 

  935.       `),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("tree-transfer"),n("span",{class:"token punctuation"},'"')]),t(`
    936. 

  936.       `),n("span",{class:"token attr-name"},":data-source"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("dataSource"),n("span",{class:"token punctuation"},'"')]),t(`
    937. 

  937.       `),n("span",{class:"token attr-name"},":target-keys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("targetKeys"),n("span",{class:"token punctuation"},'"')]),t(`
    938. 

  938.       `),n("span",{class:"token attr-name"},":render"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("item => item.title"),n("span",{class:"token punctuation"},'"')]),t(`
    939. 

  939.       `),n("span",{class:"token attr-name"},":show-select-all"),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(`
    940. 

  940.       `),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("onChange"),n("span",{class:"token punctuation"},'"')]),t(`
    941. 

  941.     `),n("span",{class:"token punctuation"},">")]),t(`
    942. 

  942.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#children"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ direction, selectedKeys, onItemSelect }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    943. 

  943.         `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-tree")]),t(`
    944. 

  944.           `),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("direction === 'left'"),n("span",{class:"token punctuation"},'"')]),t(`
    945. 

  945.           `),n("span",{class:"token attr-name"},"blockNode"),t(`
    946. 

  946.           `),n("span",{class:"token attr-name"},"checkable"),t(`
    947. 

  947.           `),n("span",{class:"token attr-name"},"checkStrictly"),t(`
    948. 

  948.           `),n("span",{class:"token attr-name"},"defaultExpandAll"),t(`
    949. 

  949.           `),n("span",{class:"token attr-name"},":checkedKeys"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("[...selectedKeys, ...targetKeys]"),n("span",{class:"token punctuation"},'"')]),t(`
    950. 

  950.           `),n("span",{class:"token attr-name"},":treeData"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("treeData"),n("span",{class:"token punctuation"},'"')]),t(`
    951. 

  951.           `),n("span",{class:"token attr-name"},"@check"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`
    952. 

  952.             (_, props) => {
    953. 

  953.               onChecked(_, props, [...selectedKeys, ...targetKeys], onItemSelect);
    954. 

  954.             }
    955. 

  955.           `),n("span",{class:"token punctuation"},'"')]),t(`
    956. 

  956.           `),n("span",{class:"token attr-name"},"@select"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t(`
    957. 

  957.             (_, props) => {
    958. 

  958.               onChecked(_, props, [...selectedKeys, ...targetKeys], onItemSelect);
    959. 

  959.             }
    960. 

  960.           `),n("span",{class:"token punctuation"},'"')]),t(`
    961. 

  961.         `),n("span",{class:"token punctuation"},"/>")]),t(`
    962. 

  962.       `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    963. 

  963.     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-transfer")]),n("span",{class:"token punctuation"},">")]),t(`
    964. 

  964.   `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    965. 

  965. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
    966. 

  966. `),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(`
    967. 

  967. `),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(`
    968. 

  968. `),n("span",{class:"token keyword"},"const"),t(" tData "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),t(`
    969. 

  969.   `),n("span",{class:"token punctuation"},"{"),t(`
    970. 

  970.     `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-0'"),n("span",{class:"token punctuation"},","),t(`
    971. 

  971.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-0'"),n("span",{class:"token punctuation"},","),t(`
    972. 

  972.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    973. 

  973.   `),n("span",{class:"token punctuation"},"{"),t(`
    974. 

  974.     `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1'"),n("span",{class:"token punctuation"},","),t(`
    975. 

  975.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1'"),n("span",{class:"token punctuation"},","),t(`
    976. 

  976.     `),n("span",{class:"token literal-property property"},"children"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),t(`
    977. 

  977.       `),n("span",{class:"token punctuation"},"{"),t(`
    978. 

  978.         `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1-0'"),n("span",{class:"token punctuation"},","),t(`
    979. 

  979.         `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1-0'"),n("span",{class:"token punctuation"},","),t(`
    980. 

  980.       `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    981. 

  981.       `),n("span",{class:"token punctuation"},"{"),t(`
    982. 

  982.         `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1-1'"),n("span",{class:"token punctuation"},","),t(`
    983. 

  983.         `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-1-1'"),n("span",{class:"token punctuation"},","),t(`
    984. 

  984.       `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    985. 

  985.     `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
    986. 

  986.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    987. 

  987.   `),n("span",{class:"token punctuation"},"{"),t(`
    988. 

  988.     `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-2'"),n("span",{class:"token punctuation"},","),t(`
    989. 

  989.     `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'0-3'"),n("span",{class:"token punctuation"},","),t(`
    990. 

  990.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    991. 

  991. `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    992. 

  992. `),n("span",{class:"token keyword"},"const"),t(" transferDataSource "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    993. 

  993. `),n("span",{class:"token keyword"},"function"),t(),n("span",{class:"token function"},"flatten"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("list "),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 punctuation"},"{"),t(`
    994. 

  994.   list`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    995. 

  995.     transferDataSource`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),t("item"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    996. 

  996.     `),n("span",{class:"token function"},"flatten"),n("span",{class:"token punctuation"},"("),t("item"),n("span",{class:"token punctuation"},"."),t("children"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    997. 

  997.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    998. 

  998. `),n("span",{class:"token punctuation"},"}"),t(`
    999. 

  999. `),n("span",{class:"token function"},"flatten"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"stringify"),n("span",{class:"token punctuation"},"("),t("tData"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    1000. 

  1000. `),n("span",{class:"token keyword"},"function"),t(),n("span",{class:"token function"},"isChecked"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("selectedKeys"),n("span",{class:"token punctuation"},","),t(" eventKey")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    1001. 

  1001.   `),n("span",{class:"token keyword"},"return"),t(" selectedKeys"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"indexOf"),n("span",{class:"token punctuation"},"("),t("eventKey"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"!=="),t(),n("span",{class:"token operator"},"-"),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),t(`
    1002. 

  1002. `),n("span",{class:"token punctuation"},"}"),t(`
    1003. 

  1003. `),n("span",{class:"token keyword"},"function"),t(),n("span",{class:"token function"},"handleTreeData"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("data"),n("span",{class:"token punctuation"},","),t(" targetKeys "),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 punctuation"},"{"),t(`
    1004. 

  1004.   data`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    1005. 

  1005.     item`),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'disabled'"),n("span",{class:"token punctuation"},"]"),t(),n("span",{class:"token operator"},"="),t(" targetKeys"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"includes"),n("span",{class:"token punctuation"},"("),t("item"),n("span",{class:"token punctuation"},"."),t("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    1006. 

  1006.     `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("item"),n("span",{class:"token punctuation"},"."),t("children"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    1007. 

  1007.       `),n("span",{class:"token function"},"handleTreeData"),n("span",{class:"token punctuation"},"("),t("item"),n("span",{class:"token punctuation"},"."),t("children"),n("span",{class:"token punctuation"},","),t(" targetKeys"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    1008. 

  1008.     `),n("span",{class:"token punctuation"},"}"),t(`
    1009. 

  1009.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    1010. 

  1010.   `),n("span",{class:"token keyword"},"return"),t(" data"),n("span",{class:"token punctuation"},";"),t(`
    1011. 

  1011. `),n("span",{class:"token punctuation"},"}"),t(`
    1012. 

  1012. `),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(`
    1013. 

  1013.   `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    1014. 

  1014.     `),n("span",{class:"token keyword"},"const"),t(" targetKeys "),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(`
    1015. 

  1015.     `),n("span",{class:"token keyword"},"const"),t(" dataSource "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),t("transferDataSource"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    1016. 

  1016.     `),n("span",{class:"token keyword"},"const"),t(" treeData "),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(`
    1017. 

  1017.       `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token function"},"handleTreeData"),n("span",{class:"token punctuation"},"("),t("tData"),n("span",{class:"token punctuation"},","),t(" targetKeys"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    1018. 

  1018.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    1019. 

  1019.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"keys"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    1020. 

  1020.       targetKeys`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" keys"),n("span",{class:"token punctuation"},";"),t(`
    1021. 

  1021.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    1022. 

  1022.     `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onChecked"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("_"),n("span",{class:"token punctuation"},","),t(" e"),n("span",{class:"token punctuation"},","),t(" checkedKeys"),n("span",{class:"token punctuation"},","),t(" onItemSelect")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
    1023. 

  1023.       `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token punctuation"},"{"),t(" eventKey "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token operator"},"="),t(" e"),n("span",{class:"token punctuation"},"."),t("node"),n("span",{class:"token punctuation"},";"),t(`
    1024. 

  1024.       `),n("span",{class:"token function"},"onItemSelect"),n("span",{class:"token punctuation"},"("),t("eventKey"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token operator"},"!"),n("span",{class:"token function"},"isChecked"),n("span",{class:"token punctuation"},"("),t("checkedKeys"),n("span",{class:"token punctuation"},","),t(" eventKey"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    1025. 

  1025.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    1026. 

  1026.     `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
    1027. 

  1027.       targetKeys`),n("span",{class:"token punctuation"},","),t(`
    1028. 

  1028.       dataSource`),n("span",{class:"token punctuation"},","),t(`
    1029. 

  1029.       treeData`),n("span",{class:"token punctuation"},","),t(`
    1030. 

  1030.       onChange`),n("span",{class:"token punctuation"},","),t(`
    1031. 

  1031.       onChecked`),n("span",{class:"token punctuation"},","),t(`
    1032. 

  1032.     `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    1033. 

  1033.   `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
    1034. 

  1034. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    1035. 

  1035. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
    1036. 

  1036. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("style")]),t(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[t(`
    1037. 

  1037. `),n("span",{class:"token selector"},".tree-transfer .ant-transfer-list:first-child"),t(),n("span",{class:"token punctuation"},"{"),t(`
    1038. 

  1038.   `),n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),t(" 50%"),n("span",{class:"token punctuation"},";"),t(`
    1039. 

  1039.   `),n("span",{class:"token property"},"flex"),n("span",{class:"token punctuation"},":"),t(" none"),n("span",{class:"token punctuation"},";"),t(`
    1040. 

  1040. `),n("span",{class:"token punctuation"},"}"),t(`
    1041. 

  1041. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("style")]),n("span",{class:"token punctuation"},">")]),t(`
    1042. 

  1042. `)])],-1)])),_:1})}var fn=b(Zn,[["render",Gn],["__scopeId","data-v-0ce97708"]]);const wn={pageData:{title:"Transfer",description:"",frontmatter:{category:"Components",type:"\u6570\u636E\u5F55\u5165",title:"Transfer",subtitle:"\u7A7F\u68AD\u6846",cover:"https://gw.alipayobjects.com/zos/alicdn/QAXskNI4G/Transfer.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:"\u4E8B\u4EF6",slug:"\u4E8B\u4EF6",content:""},{level:3,title:"Render Props",slug:"render-props",content:"Transfer \u652F\u6301\u63A5\u6536 `children` \u81EA\u5B9A\u4E49\u6E32\u67D3\u5217\u8868\uFF0C\u5E76\u8FD4\u56DE\u4EE5\u4E0B\u53C2\u6570\uFF1A"},{level:2,title:"\u6CE8\u610F",slug:"\u6CE8\u610F",content:"\u6309\u7167 Vue \u6700\u65B0\u7684\u89C4\u8303\uFF0C\u6240\u6709\u7684\u7EC4\u4EF6\u6570\u7EC4\u6700\u597D\u7ED1\u5B9A key\u3002\u5728 Transfer \u4E2D\uFF0C`dataSource`\u91CC\u7684\u6570\u636E\u503C\u9700\u8981\u6307\u5B9A `key` \u503C\u3002\u5BF9\u4E8E `dataSource` \u9ED8\u8BA4\u5C06\u6BCF\u5217\u6570\u636E\u7684 `key` \u5C5E\u6027\u4F5C\u4E3A\u552F\u4E00\u7684\u6807\u8BC6\u3002"}],relativePath:"src/docs/transfer/index.zh-CN.md",content:`
    1043. 

  1043. \u53CC\u680F\u7A7F\u68AD\u9009\u62E9\u6846\u3002
    1044. 

  1044. 

  1045. ## \u4F55\u65F6\u4F7F\u7528
    1046. 

  1046. 

  1047. - \u9700\u8981\u5728\u591A\u4E2A\u53EF\u9009\u9879\u4E2D\u8FDB\u884C\u591A\u9009\u65F6\u3002
    1048. 

  1048. - \u6BD4\u8D77 Select \u548C TreeSelect\uFF0C\u7A7F\u68AD\u6846\u5360\u636E\u66F4\u5927\u7684\u7A7A\u95F4\uFF0C\u53EF\u4EE5\u5C55\u793A\u53EF\u9009\u9879\u7684\u66F4\u591A\u4FE1\u606F\u3002
    1049. 

  1049. 

  1050. ## API
    1051. 

  1051. 

  1052. | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |
    1053. 

  1053. | --- | --- | --- | --- | --- |
    1054. 

  1054. | dataSource | \u6570\u636E\u6E90\uFF0C\u5176\u4E2D\u7684\u6570\u636E\u5C06\u4F1A\u88AB\u6E32\u67D3\u5230\u5DE6\u8FB9\u4E00\u680F\u4E2D\uFF0C\`targetKeys\` \u4E2D\u6307\u5B9A\u7684\u9664\u5916\u3002 | \\[{key: string.isRequired,title: string.isRequired,description: string,disabled: bool}\\]\\[] | \\[] |  |
    1055. 

  1055. | disabled | \u662F\u5426\u7981\u7528 | boolean | false |  |
    1056. 

  1056. | filterOption | \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 | (inputValue, option): boolean |  |  |
    1057. 

  1057. | footer | \u53EF\u4EE5\u8BBE\u7F6E\u4E3A\u4E00\u4E2A \u4F5C\u7528\u57DF\u63D2\u69FD | slot=&quot;footer&quot; slot-scope=&quot;props&quot; |  |  |
    1058. 

  1058. | lazy | Transfer \u4F7F\u7528\u4E86 [vc-lazy-load]\u4F18\u5316\u6027\u80FD\uFF0C\u8FD9\u91CC\u53EF\u4EE5\u8BBE\u7F6E\u76F8\u5173\u53C2\u6570\u3002\u8BBE\u4E3A \`false\` \u53EF\u4EE5\u5173\u95ED\u61D2\u52A0\u8F7D\u3002 | object\\|boolean | \`{ height: 32, offset: 32 }\` |  |
    1059. 

  1059. | listStyle | \u4E24\u4E2A\u7A7F\u68AD\u6846\u7684\u81EA\u5B9A\u4E49\u6837\u5F0F | object |  |  |
    1060. 

  1060. | locale | \u5404\u79CD\u8BED\u8A00 | object | \`{ itemUnit: &#39;\u9879&#39;, itemsUnit: &#39;\u9879&#39;, notFoundContent: &#39;\u5217\u8868\u4E3A\u7A7A&#39;, searchPlaceholder: &#39;\u8BF7\u8F93\u5165\u641C\u7D22\u5185\u5BB9&#39; }\` |  |
    1061. 

  1061. | operations | \u64CD\u4F5C\u6587\u6848\u96C6\u5408\uFF0C\u987A\u5E8F\u4ECE\u4E0A\u81F3\u4E0B | string\\[] | \\[&#39;&gt;&#39;, &#39;&lt;&#39;] |  |
    1062. 

  1062. | render | \u6BCF\u884C\u6570\u636E\u6E32\u67D3\u51FD\u6570\uFF0C\u8BE5\u51FD\u6570\u7684\u5165\u53C2\u4E3A \`dataSource\` \u4E2D\u7684\u9879\uFF0C\u8FD4\u56DE\u503C\u4E3A element\u3002\u6216\u8005\u8FD4\u56DE\u4E00\u4E2A\u666E\u901A\u5BF9\u8C61\uFF0C\u5176\u4E2D \`label\` \u5B57\u6BB5\u4E3A element\uFF0C\`value\` \u5B57\u6BB5\u4E3A title | Function(record)\\| slot |  |  |
    1063. 

  1063. | selectedKeys | \u8BBE\u7F6E\u54EA\u4E9B\u9879\u5E94\u8BE5\u88AB\u9009\u4E2D | string\\[] | \\[] |  |
    1064. 

  1064. | showSearch | \u662F\u5426\u663E\u793A\u641C\u7D22\u6846 | boolean | false |  |
    1065. 

  1065. | showSelectAll | \u662F\u5426\u5C55\u793A\u5168\u9009\u52FE\u9009\u6846 | boolean | true |  |
    1066. 

  1066. | targetKeys | \u663E\u793A\u5728\u53F3\u4FA7\u6846\u6570\u636E\u7684 key \u96C6\u5408 | string\\[] | \\[] |  |
    1067. 

  1067. | titles | \u6807\u9898\u96C6\u5408\uFF0C\u987A\u5E8F\u4ECE\u5DE6\u81F3\u53F3 | string\\[] | \\[&#39;&#39;, &#39;&#39;] |  |
    1068. 

  1068. 

  1069. ### \u4E8B\u4EF6
    1070. 

  1070. 

  1071. | \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E | \u56DE\u8C03\u53C2\u6570 | \u7248\u672C |
    1072. 

  1072. | --- | --- | --- | --- |
    1073. 

  1073. | change | \u9009\u9879\u5728\u4E24\u680F\u4E4B\u95F4\u8F6C\u79FB\u65F6\u7684\u56DE\u8C03\u51FD\u6570 | (targetKeys, direction, moveKeys): void |  |
    1074. 

  1074. | scroll | \u9009\u9879\u5217\u8868\u6EDA\u52A8\u65F6\u7684\u56DE\u8C03\u51FD\u6570 | (direction, event): void |  |
    1075. 

  1075. | search | \u641C\u7D22\u6846\u5185\u5BB9\u65F6\u6539\u53D8\u65F6\u7684\u56DE\u8C03\u51FD\u6570 | (direction: &#39;left&#39;\\|&#39;right&#39;, value: string): void | - |
    1076. 

  1076. | selectChange | \u9009\u4E2D\u9879\u53D1\u751F\u6539\u53D8\u65F6\u7684\u56DE\u8C03\u51FD\u6570 | (sourceSelectedKeys, targetSelectedKeys): void |  |
    1077. 

  1077. 

  1078. ### Render Props
    1079. 

  1079. 

  1080. Transfer \u652F\u6301\u63A5\u6536 \`children\` \u81EA\u5B9A\u4E49\u6E32\u67D3\u5217\u8868\uFF0C\u5E76\u8FD4\u56DE\u4EE5\u4E0B\u53C2\u6570\uFF1A
    1081. 

  1081. 

  1082. \`\`\`json
    1083. 

  1083. {
    1084. 

  1084.   &quot;direction&quot;: String,
    1085. 

  1085.   &quot;disabled&quot;: Boolean,
    1086. 

  1086.   &quot;filteredItems&quot;: Array,
    1087. 

  1087.   &quot;selectedKeys&quot;: Array,
    1088. 

  1088.   &quot;onItemSelect&quot;: Function,
    1089. 

  1089.   &quot;onItemSelectAll&quot;: Function
    1090. 

  1090. }
    1091. 

  1091. \`\`\`
    1092. 

  1092. 

  1093. | \u53C2\u6570          | \u8BF4\u660E           | \u7C7B\u578B                                | \u7248\u672C |
    1094. 

  1094. | ------------- | -------------- | ----------------------------------- | ---- |
    1095. 

  1095. | direction     | \u6E32\u67D3\u5217\u8868\u7684\u65B9\u5411 | &#39;left&#39; \\| &#39;right&#39;                   |      |
    1096. 

  1096. | disabled      | \u662F\u5426\u7981\u7528\u5217\u8868   | boolean                             |      |
    1097. 

  1097. | filteredItems | \u8FC7\u6EE4\u540E\u7684\u6570\u636E   | TransferItem[]                      |      |
    1098. 

  1098. | selectedKeys  | \u9009\u4E2D\u7684\u6761\u76EE     | string[]                            |      |
    1099. 

  1099. | itemSelect    | \u52FE\u9009\u6761\u76EE       | (key: string, selected: boolean)    |      |
    1100. 

  1100. | itemSelectAll | \u52FE\u9009\u4E00\u7EC4\u6761\u76EE   | (keys: string[], selected: boolean) |      |
    1101. 

  1101. 

  1102. #### \u53C2\u8003\u793A\u4F8B
    1103. 

  1103. 

  1104. \`\`\`html
    1105. 

  1105. &lt;a-transfer&gt;
    1106. 

  1106.   &lt;template
    1107. 

  1107.     #children=&quot;{
    1108. 

  1108.       direction,
    1109. 

  1109.       filteredItems,
    1110. 

  1110.       selectedKeys,
    1111. 

  1111.       disabled: listDisabled,
    1112. 

  1112.       onItemSelectAll,
    1113. 

  1113.       onItemSelect,
    1114. 

  1114.     }&quot;
    1115. 

  1115.   &gt;
    1116. 

  1116.     &lt;your-component /&gt;
    1117. 

  1117.   &lt;template&gt;
    1118. 

  1118. &lt;/a-transfer&gt;
    1119. 

  1119. \`\`\`
    1120. 

  1120. 

  1121. ## \u6CE8\u610F
    1122. 

  1122. 

  1123. \u6309\u7167 Vue \u6700\u65B0\u7684\u89C4\u8303\uFF0C\u6240\u6709\u7684\u7EC4\u4EF6\u6570\u7EC4\u6700\u597D\u7ED1\u5B9A key\u3002\u5728 Transfer \u4E2D\uFF0C\`dataSource\`\u91CC\u7684\u6570\u636E\u503C\u9700\u8981\u6307\u5B9A \`key\` \u503C\u3002\u5BF9\u4E8E \`dataSource\` \u9ED8\u8BA4\u5C06\u6BCF\u5217\u6570\u636E\u7684 \`key\` \u5C5E\u6027\u4F5C\u4E3A\u552F\u4E00\u7684\u6807\u8BC6\u3002
    1124. 

  1124. 

  1125. \u5982\u679C\u4F60\u7684\u6570\u636E\u6CA1\u6709\u8FD9\u4E2A\u5C5E\u6027\uFF0C\u52A1\u5FC5\u4F7F\u7528 \`rowKey\` \u6765\u6307\u5B9A\u6570\u636E\u5217\u7684\u4E3B\u952E\u3002
    1126. 

  1126. 

  1127. \`\`\`jsx
    1128. 

  1128. // \u6BD4\u5982\u4F60\u7684\u6570\u636E\u4E3B\u952E\u662F uid
    1129. 

  1129. return &lt;Transfer :rowKey=&quot;record =&gt; record.uid&quot; /&gt;;
    1130. 

  1130. \`\`\`
    1131. 

  1131. `,html:`<p>\u53CC\u680F\u7A7F\u68AD\u9009\u62E9\u6846\u3002</p>
    1132. 

  1132. <h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528</h2>
    1133. 

  1133. <ul>
    1134. 

  1134. <li>\u9700\u8981\u5728\u591A\u4E2A\u53EF\u9009\u9879\u4E2D\u8FDB\u884C\u591A\u9009\u65F6\u3002</li>
    1135. 

  1135. <li>\u6BD4\u8D77 Select \u548C TreeSelect\uFF0C\u7A7F\u68AD\u6846\u5360\u636E\u66F4\u5927\u7684\u7A7A\u95F4\uFF0C\u53EF\u4EE5\u5C55\u793A\u53EF\u9009\u9879\u7684\u66F4\u591A\u4FE1\u606F\u3002</li>
    1136. 

  1136. </ul>
    1137. 

  1137. <h2 id="api">API</h2>
    1138. 

  1138. <table>
    1139. 

  1139. <thead>
    1140. 

  1140. <tr>
    1141. 

  1141. <th>\u53C2\u6570</th>
    1142. 

  1142. <th>\u8BF4\u660E</th>
    1143. 

  1143. <th>\u7C7B\u578B</th>
    1144. 

  1144. <th>\u9ED8\u8BA4\u503C</th>
    1145. 

  1145. <th>\u7248\u672C</th>
    1146. 

  1146. </tr>
    1147. 

  1147. </thead>
    1148. 

  1148. <tbody>
    1149. 

  1149. <tr>
    1150. 

  1150. <td>dataSource</td>
    1151. 

  1151. <td>\u6570\u636E\u6E90\uFF0C\u5176\u4E2D\u7684\u6570\u636E\u5C06\u4F1A\u88AB\u6E32\u67D3\u5230\u5DE6\u8FB9\u4E00\u680F\u4E2D\uFF0C<code>targetKeys</code> \u4E2D\u6307\u5B9A\u7684\u9664\u5916\u3002</td>
    1152. 

  1152. <td>[{key: string.isRequired,title: string.isRequired,description: string,disabled: bool}][]</td>
    1153. 

  1153. <td>[]</td>
    1154. 

  1154. <td></td>
    1155. 

  1155. </tr>
    1156. 

  1156. <tr>
    1157. 

  1157. <td>disabled</td>
    1158. 

  1158. <td>\u662F\u5426\u7981\u7528</td>
    1159. 

  1159. <td>boolean</td>
    1160. 

  1160. <td>false</td>
    1161. 

  1161. <td></td>
    1162. 

  1162. </tr>
    1163. 

  1163. <tr>
    1164. 

  1164. <td>filterOption</td>
    1165. 

  1165. <td>\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>
    1166. 

  1166. <td>(inputValue, option): boolean</td>
    1167. 

  1167. <td></td>
    1168. 

  1168. <td></td>
    1169. 

  1169. </tr>
    1170. 

  1170. <tr>
    1171. 

  1171. <td>footer</td>
    1172. 

  1172. <td>\u53EF\u4EE5\u8BBE\u7F6E\u4E3A\u4E00\u4E2A \u4F5C\u7528\u57DF\u63D2\u69FD</td>
    1173. 

  1173. <td>slot=&quot;footer&quot; slot-scope=&quot;props&quot;</td>
    1174. 

  1174. <td></td>
    1175. 

  1175. <td></td>
    1176. 

  1176. </tr>
    1177. 

  1177. <tr>
    1178. 

  1178. <td>lazy</td>
    1179. 

  1179. <td>Transfer \u4F7F\u7528\u4E86 [vc-lazy-load]\u4F18\u5316\u6027\u80FD\uFF0C\u8FD9\u91CC\u53EF\u4EE5\u8BBE\u7F6E\u76F8\u5173\u53C2\u6570\u3002\u8BBE\u4E3A <code>false</code> \u53EF\u4EE5\u5173\u95ED\u61D2\u52A0\u8F7D\u3002</td>
    1180. 

  1180. <td>object|boolean</td>
    1181. 

  1181. <td><code>{ height: 32, offset: 32 }</code></td>
    1182. 

  1182. <td></td>
    1183. 

  1183. </tr>
    1184. 

  1184. <tr>
    1185. 

  1185. <td>listStyle</td>
    1186. 

  1186. <td>\u4E24\u4E2A\u7A7F\u68AD\u6846\u7684\u81EA\u5B9A\u4E49\u6837\u5F0F</td>
    1187. 

  1187. <td>object</td>
    1188. 

  1188. <td></td>
    1189. 

  1189. <td></td>
    1190. 

  1190. </tr>
    1191. 

  1191. <tr>
    1192. 

  1192. <td>locale</td>
    1193. 

  1193. <td>\u5404\u79CD\u8BED\u8A00</td>
    1194. 

  1194. <td>object</td>
    1195. 

  1195. <td><code>{ itemUnit: '\u9879', itemsUnit: '\u9879', notFoundContent: '\u5217\u8868\u4E3A\u7A7A', searchPlaceholder: '\u8BF7\u8F93\u5165\u641C\u7D22\u5185\u5BB9' }</code></td>
    1196. 

  1196. <td></td>
    1197. 

  1197. </tr>
    1198. 

  1198. <tr>
    1199. 

  1199. <td>operations</td>
    1200. 

  1200. <td>\u64CD\u4F5C\u6587\u6848\u96C6\u5408\uFF0C\u987A\u5E8F\u4ECE\u4E0A\u81F3\u4E0B</td>
    1201. 

  1201. <td>string[]</td>
    1202. 

  1202. <td>['&gt;', '&lt;']</td>
    1203. 

  1203. <td></td>
    1204. 

  1204. </tr>
    1205. 

  1205. <tr>
    1206. 

  1206. <td>render</td>
    1207. 

  1207. <td>\u6BCF\u884C\u6570\u636E\u6E32\u67D3\u51FD\u6570\uFF0C\u8BE5\u51FD\u6570\u7684\u5165\u53C2\u4E3A <code>dataSource</code> \u4E2D\u7684\u9879\uFF0C\u8FD4\u56DE\u503C\u4E3A element\u3002\u6216\u8005\u8FD4\u56DE\u4E00\u4E2A\u666E\u901A\u5BF9\u8C61\uFF0C\u5176\u4E2D <code>label</code> \u5B57\u6BB5\u4E3A element\uFF0C<code>value</code> \u5B57\u6BB5\u4E3A title</td>
    1208. 

  1208. <td>Function(record)| slot</td>
    1209. 

  1209. <td></td>
    1210. 

  1210. <td></td>
    1211. 

  1211. </tr>
    1212. 

  1212. <tr>
    1213. 

  1213. <td>selectedKeys</td>
    1214. 

  1214. <td>\u8BBE\u7F6E\u54EA\u4E9B\u9879\u5E94\u8BE5\u88AB\u9009\u4E2D</td>
    1215. 

  1215. <td>string[]</td>
    1216. 

  1216. <td>[]</td>
    1217. 

  1217. <td></td>
    1218. 

  1218. </tr>
    1219. 

  1219. <tr>
    1220. 

  1220. <td>showSearch</td>
    1221. 

  1221. <td>\u662F\u5426\u663E\u793A\u641C\u7D22\u6846</td>
    1222. 

  1222. <td>boolean</td>
    1223. 

  1223. <td>false</td>
    1224. 

  1224. <td></td>
    1225. 

  1225. </tr>
    1226. 

  1226. <tr>
    1227. 

  1227. <td>showSelectAll</td>
    1228. 

  1228. <td>\u662F\u5426\u5C55\u793A\u5168\u9009\u52FE\u9009\u6846</td>
    1229. 

  1229. <td>boolean</td>
    1230. 

  1230. <td>true</td>
    1231. 

  1231. <td></td>
    1232. 

  1232. </tr>
    1233. 

  1233. <tr>
    1234. 

  1234. <td>targetKeys</td>
    1235. 

  1235. <td>\u663E\u793A\u5728\u53F3\u4FA7\u6846\u6570\u636E\u7684 key \u96C6\u5408</td>
    1236. 

  1236. <td>string[]</td>
    1237. 

  1237. <td>[]</td>
    1238. 

  1238. <td></td>
    1239. 

  1239. </tr>
    1240. 

  1240. <tr>
    1241. 

  1241. <td>titles</td>
    1242. 

  1242. <td>\u6807\u9898\u96C6\u5408\uFF0C\u987A\u5E8F\u4ECE\u5DE6\u81F3\u53F3</td>
    1243. 

  1243. <td>string[]</td>
    1244. 

  1244. <td>['', '']</td>
    1245. 

  1245. <td></td>
    1246. 

  1246. </tr>
    1247. 

  1247. </tbody>
    1248. 

  1248. </table>
    1249. 

  1249. <h3 id="\u4E8B\u4EF6">\u4E8B\u4EF6</h3>
    1250. 

  1250. <table>
    1251. 

  1251. <thead>
    1252. 

  1252. <tr>
    1253. 

  1253. <th>\u4E8B\u4EF6\u540D\u79F0</th>
    1254. 

  1254. <th>\u8BF4\u660E</th>
    1255. 

  1255. <th>\u56DE\u8C03\u53C2\u6570</th>
    1256. 

  1256. <th>\u7248\u672C</th>
    1257. 

  1257. </tr>
    1258. 

  1258. </thead>
    1259. 

  1259. <tbody>
    1260. 

  1260. <tr>
    1261. 

  1261. <td>change</td>
    1262. 

  1262. <td>\u9009\u9879\u5728\u4E24\u680F\u4E4B\u95F4\u8F6C\u79FB\u65F6\u7684\u56DE\u8C03\u51FD\u6570</td>
    1263. 

  1263. <td>(targetKeys, direction, moveKeys): void</td>
    1264. 

  1264. <td></td>
    1265. 

  1265. </tr>
    1266. 

  1266. <tr>
    1267. 

  1267. <td>scroll</td>
    1268. 

  1268. <td>\u9009\u9879\u5217\u8868\u6EDA\u52A8\u65F6\u7684\u56DE\u8C03\u51FD\u6570</td>
    1269. 

  1269. <td>(direction, event): void</td>
    1270. 

  1270. <td></td>
    1271. 

  1271. </tr>
    1272. 

  1272. <tr>
    1273. 

  1273. <td>search</td>
    1274. 

  1274. <td>\u641C\u7D22\u6846\u5185\u5BB9\u65F6\u6539\u53D8\u65F6\u7684\u56DE\u8C03\u51FD\u6570</td>
    1275. 

  1275. <td>(direction: 'left'|'right', value: string): void</td>
    1276. 

  1276. <td>-</td>
    1277. 

  1277. </tr>
    1278. 

  1278. <tr>
    1279. 

  1279. <td>selectChange</td>
    1280. 

  1280. <td>\u9009\u4E2D\u9879\u53D1\u751F\u6539\u53D8\u65F6\u7684\u56DE\u8C03\u51FD\u6570</td>
    1281. 

  1281. <td>(sourceSelectedKeys, targetSelectedKeys): void</td>
    1282. 

  1282. <td></td>
    1283. 

  1283. </tr>
    1284. 

  1284. </tbody>
    1285. 

  1285. </table>
    1286. 

  1286. <h3 id="render-props">Render Props</h3>
    1287. 

  1287. <p>Transfer \u652F\u6301\u63A5\u6536 <code>children</code> \u81EA\u5B9A\u4E49\u6E32\u67D3\u5217\u8868\uFF0C\u5E76\u8FD4\u56DE\u4EE5\u4E0B\u53C2\u6570\uFF1A</p>
    1288. 

  1288. <pre class="language-json" v-pre><code><span class="token punctuation">{</span>
    1289. 

  1289.   <span class="token property">"direction"</span><span class="token operator">:</span> String<span class="token punctuation">,</span>
    1290. 

  1290.   <span class="token property">"disabled"</span><span class="token operator">:</span> Boolean<span class="token punctuation">,</span>
    1291. 

  1291.   <span class="token property">"filteredItems"</span><span class="token operator">:</span> Array<span class="token punctuation">,</span>
    1292. 

  1292.   <span class="token property">"selectedKeys"</span><span class="token operator">:</span> Array<span class="token punctuation">,</span>
    1293. 

  1293.   <span class="token property">"onItemSelect"</span><span class="token operator">:</span> Function<span class="token punctuation">,</span>
    1294. 

  1294.   <span class="token property">"onItemSelectAll"</span><span class="token operator">:</span> Function
    1295. 

  1295. <span class="token punctuation">}</span>
    1296. 

  1296. </code></pre>
    1297. 

  1297. <table>
    1298. 

  1298. <thead>
    1299. 

  1299. <tr>
    1300. 

  1300. <th>\u53C2\u6570</th>
    1301. 

  1301. <th>\u8BF4\u660E</th>
    1302. 

  1302. <th>\u7C7B\u578B</th>
    1303. 

  1303. <th>\u7248\u672C</th>
    1304. 

  1304. </tr>
    1305. 

  1305. </thead>
    1306. 

  1306. <tbody>
    1307. 

  1307. <tr>
    1308. 

  1308. <td>direction</td>
    1309. 

  1309. <td>\u6E32\u67D3\u5217\u8868\u7684\u65B9\u5411</td>
    1310. 

  1310. <td>'left' | 'right'</td>
    1311. 

  1311. <td></td>
    1312. 

  1312. </tr>
    1313. 

  1313. <tr>
    1314. 

  1314. <td>disabled</td>
    1315. 

  1315. <td>\u662F\u5426\u7981\u7528\u5217\u8868</td>
    1316. 

  1316. <td>boolean</td>
    1317. 

  1317. <td></td>
    1318. 

  1318. </tr>
    1319. 

  1319. <tr>
    1320. 

  1320. <td>filteredItems</td>
    1321. 

  1321. <td>\u8FC7\u6EE4\u540E\u7684\u6570\u636E</td>
    1322. 

  1322. <td>TransferItem[]</td>
    1323. 

  1323. <td></td>
    1324. 

  1324. </tr>
    1325. 

  1325. <tr>
    1326. 

  1326. <td>selectedKeys</td>
    1327. 

  1327. <td>\u9009\u4E2D\u7684\u6761\u76EE</td>
    1328. 

  1328. <td>string[]</td>
    1329. 

  1329. <td></td>
    1330. 

  1330. </tr>
    1331. 

  1331. <tr>
    1332. 

  1332. <td>itemSelect</td>
    1333. 

  1333. <td>\u52FE\u9009\u6761\u76EE</td>
    1334. 

  1334. <td>(key: string, selected: boolean)</td>
    1335. 

  1335. <td></td>
    1336. 

  1336. </tr>
    1337. 

  1337. <tr>
    1338. 

  1338. <td>itemSelectAll</td>
    1339. 

  1339. <td>\u52FE\u9009\u4E00\u7EC4\u6761\u76EE</td>
    1340. 

  1340. <td>(keys: string[], selected: boolean)</td>
    1341. 

  1341. <td></td>
    1342. 

  1342. </tr>
    1343. 

  1343. </tbody>
    1344. 

  1344. </table>
    1345. 

  1345. <h4 id="\u53C2\u8003\u793A\u4F8B">\u53C2\u8003\u793A\u4F8B</h4>
    1346. 

  1346. <pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-transfer</span><span class="token punctuation">></span></span>
    1347. 

  1347.   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span>
    1348. 

  1348.     <span class="token attr-name">#children</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{
    1349. 

  1349.       direction,
    1350. 

  1350.       filteredItems,
    1351. 

  1351.       selectedKeys,
    1352. 

  1352.       disabled: listDisabled,
    1353. 

  1353.       onItemSelectAll,
    1354. 

  1354.       onItemSelect,
    1355. 

  1355.     }<span class="token punctuation">"</span></span>
    1356. 

  1356.   <span class="token punctuation">></span></span>
    1357. 

  1357.     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>your-component</span> <span class="token punctuation">/></span></span>
    1358. 

  1358.   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">></span></span>
    1359. 

  1359. <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-transfer</span><span class="token punctuation">></span></span>
    1360. 

  1360. </code></pre>
    1361. 

  1361. <h2 id="\u6CE8\u610F">\u6CE8\u610F</h2>
    1362. 

  1362. <p>\u6309\u7167 Vue \u6700\u65B0\u7684\u89C4\u8303\uFF0C\u6240\u6709\u7684\u7EC4\u4EF6\u6570\u7EC4\u6700\u597D\u7ED1\u5B9A key\u3002\u5728 Transfer \u4E2D\uFF0C<code>dataSource</code>\u91CC\u7684\u6570\u636E\u503C\u9700\u8981\u6307\u5B9A <code>key</code> \u503C\u3002\u5BF9\u4E8E <code>dataSource</code> \u9ED8\u8BA4\u5C06\u6BCF\u5217\u6570\u636E\u7684 <code>key</code> \u5C5E\u6027\u4F5C\u4E3A\u552F\u4E00\u7684\u6807\u8BC6\u3002</p>
    1363. 

  1363. <p>\u5982\u679C\u4F60\u7684\u6570\u636E\u6CA1\u6709\u8FD9\u4E2A\u5C5E\u6027\uFF0C\u52A1\u5FC5\u4F7F\u7528 <code>rowKey</code> \u6765\u6307\u5B9A\u6570\u636E\u5217\u7684\u4E3B\u952E\u3002</p>
    1364. 

  1364. <pre class="language-jsx" v-pre><code><span class="token comment">// \u6BD4\u5982\u4F60\u7684\u6570\u636E\u4E3B\u952E\u662F uid</span>
    1365. 

  1365. <span class="token keyword">return</span> <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span><span class="token class-name">Transfer</span></span> <span class="token attr-name">:rowKey</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>record => record.uid<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span><span class="token punctuation">;</span>
    1366. 

  1366. </code></pre>
    1367. 

  1367. `,lastUpdated:1748059052780}},Kn={class:"markdown"};function vn(s,a,p,I,l,u){return h(),B("article",Kn,a[0]||(a[0]=[Y(`<p>\u53CC\u680F\u7A7F\u68AD\u9009\u62E9\u6846\u3002</p><h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528</h2><ul><li>\u9700\u8981\u5728\u591A\u4E2A\u53EF\u9009\u9879\u4E2D\u8FDB\u884C\u591A\u9009\u65F6\u3002</li><li>\u6BD4\u8D77 Select \u548C TreeSelect\uFF0C\u7A7F\u68AD\u6846\u5360\u636E\u66F4\u5927\u7684\u7A7A\u95F4\uFF0C\u53EF\u4EE5\u5C55\u793A\u53EF\u9009\u9879\u7684\u66F4\u591A\u4FE1\u606F\u3002</li></ul><h2 id="api">API</h2><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>dataSource</td><td>\u6570\u636E\u6E90\uFF0C\u5176\u4E2D\u7684\u6570\u636E\u5C06\u4F1A\u88AB\u6E32\u67D3\u5230\u5DE6\u8FB9\u4E00\u680F\u4E2D\uFF0C<code>targetKeys</code> \u4E2D\u6307\u5B9A\u7684\u9664\u5916\u3002</td><td>[{key: string.isRequired,title: string.isRequired,description: string,disabled: bool}][]</td><td>[]</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>filterOption</td><td>\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>(inputValue, option): boolean</td><td></td><td></td></tr><tr><td>footer</td><td>\u53EF\u4EE5\u8BBE\u7F6E\u4E3A\u4E00\u4E2A \u4F5C\u7528\u57DF\u63D2\u69FD</td><td>slot=&quot;footer&quot; slot-scope=&quot;props&quot;</td><td></td><td></td></tr><tr><td>lazy</td><td>Transfer \u4F7F\u7528\u4E86 [vc-lazy-load]\u4F18\u5316\u6027\u80FD\uFF0C\u8FD9\u91CC\u53EF\u4EE5\u8BBE\u7F6E\u76F8\u5173\u53C2\u6570\u3002\u8BBE\u4E3A <code>false</code> \u53EF\u4EE5\u5173\u95ED\u61D2\u52A0\u8F7D\u3002</td><td>object|boolean</td><td><code>{ height: 32, offset: 32 }</code></td><td></td></tr><tr><td>listStyle</td><td>\u4E24\u4E2A\u7A7F\u68AD\u6846\u7684\u81EA\u5B9A\u4E49\u6837\u5F0F</td><td>object</td><td></td><td></td></tr><tr><td>locale</td><td>\u5404\u79CD\u8BED\u8A00</td><td>object</td><td><code>{ itemUnit: &#39;\u9879&#39;, itemsUnit: &#39;\u9879&#39;, notFoundContent: &#39;\u5217\u8868\u4E3A\u7A7A&#39;, searchPlaceholder: &#39;\u8BF7\u8F93\u5165\u641C\u7D22\u5185\u5BB9&#39; }</code></td><td></td></tr><tr><td>operations</td><td>\u64CD\u4F5C\u6587\u6848\u96C6\u5408\uFF0C\u987A\u5E8F\u4ECE\u4E0A\u81F3\u4E0B</td><td>string[]</td><td>[&#39;&gt;&#39;, &#39;&lt;&#39;]</td><td></td></tr><tr><td>render</td><td>\u6BCF\u884C\u6570\u636E\u6E32\u67D3\u51FD\u6570\uFF0C\u8BE5\u51FD\u6570\u7684\u5165\u53C2\u4E3A <code>dataSource</code> \u4E2D\u7684\u9879\uFF0C\u8FD4\u56DE\u503C\u4E3A element\u3002\u6216\u8005\u8FD4\u56DE\u4E00\u4E2A\u666E\u901A\u5BF9\u8C61\uFF0C\u5176\u4E2D <code>label</code> \u5B57\u6BB5\u4E3A element\uFF0C<code>value</code> \u5B57\u6BB5\u4E3A title</td><td>Function(record)| slot</td><td></td><td></td></tr><tr><td>selectedKeys</td><td>\u8BBE\u7F6E\u54EA\u4E9B\u9879\u5E94\u8BE5\u88AB\u9009\u4E2D</td><td>string[]</td><td>[]</td><td></td></tr><tr><td>showSearch</td><td>\u662F\u5426\u663E\u793A\u641C\u7D22\u6846</td><td>boolean</td><td>false</td><td></td></tr><tr><td>showSelectAll</td><td>\u662F\u5426\u5C55\u793A\u5168\u9009\u52FE\u9009\u6846</td><td>boolean</td><td>true</td><td></td></tr><tr><td>targetKeys</td><td>\u663E\u793A\u5728\u53F3\u4FA7\u6846\u6570\u636E\u7684 key \u96C6\u5408</td><td>string[]</td><td>[]</td><td></td></tr><tr><td>titles</td><td>\u6807\u9898\u96C6\u5408\uFF0C\u987A\u5E8F\u4ECE\u5DE6\u81F3\u53F3</td><td>string[]</td><td>[&#39;&#39;, &#39;&#39;]</td><td></td></tr></tbody></table><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><th>\u7248\u672C</th></tr></thead><tbody><tr><td>change</td><td>\u9009\u9879\u5728\u4E24\u680F\u4E4B\u95F4\u8F6C\u79FB\u65F6\u7684\u56DE\u8C03\u51FD\u6570</td><td>(targetKeys, direction, moveKeys): void</td><td></td></tr><tr><td>scroll</td><td>\u9009\u9879\u5217\u8868\u6EDA\u52A8\u65F6\u7684\u56DE\u8C03\u51FD\u6570</td><td>(direction, event): void</td><td></td></tr><tr><td>search</td><td>\u641C\u7D22\u6846\u5185\u5BB9\u65F6\u6539\u53D8\u65F6\u7684\u56DE\u8C03\u51FD\u6570</td><td>(direction: &#39;left&#39;|&#39;right&#39;, value: string): void</td><td>-</td></tr><tr><td>selectChange</td><td>\u9009\u4E2D\u9879\u53D1\u751F\u6539\u53D8\u65F6\u7684\u56DE\u8C03\u51FD\u6570</td><td>(sourceSelectedKeys, targetSelectedKeys): void</td><td></td></tr></tbody></table><h3 id="render-props">Render Props</h3><p>Transfer \u652F\u6301\u63A5\u6536 <code>children</code> \u81EA\u5B9A\u4E49\u6E32\u67D3\u5217\u8868\uFF0C\u5E76\u8FD4\u56DE\u4EE5\u4E0B\u53C2\u6570\uFF1A</p><pre class="language-json"><code><span class="token punctuation">{</span>
    1368. 

  1368.   <span class="token property">&quot;direction&quot;</span><span class="token operator">:</span> String<span class="token punctuation">,</span>
    1369. 

  1369.   <span class="token property">&quot;disabled&quot;</span><span class="token operator">:</span> Boolean<span class="token punctuation">,</span>
    1370. 

  1370.   <span class="token property">&quot;filteredItems&quot;</span><span class="token operator">:</span> Array<span class="token punctuation">,</span>
    1371. 

  1371.   <span class="token property">&quot;selectedKeys&quot;</span><span class="token operator">:</span> Array<span class="token punctuation">,</span>
    1372. 

  1372.   <span class="token property">&quot;onItemSelect&quot;</span><span class="token operator">:</span> Function<span class="token punctuation">,</span>
    1373. 

  1373.   <span class="token property">&quot;onItemSelectAll&quot;</span><span class="token operator">:</span> Function
    1374. 

  1374. <span class="token punctuation">}</span>
    1375. 

  1375. </code></pre><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u7248\u672C</th></tr></thead><tbody><tr><td>direction</td><td>\u6E32\u67D3\u5217\u8868\u7684\u65B9\u5411</td><td>&#39;left&#39; | &#39;right&#39;</td><td></td></tr><tr><td>disabled</td><td>\u662F\u5426\u7981\u7528\u5217\u8868</td><td>boolean</td><td></td></tr><tr><td>filteredItems</td><td>\u8FC7\u6EE4\u540E\u7684\u6570\u636E</td><td>TransferItem[]</td><td></td></tr><tr><td>selectedKeys</td><td>\u9009\u4E2D\u7684\u6761\u76EE</td><td>string[]</td><td></td></tr><tr><td>itemSelect</td><td>\u52FE\u9009\u6761\u76EE</td><td>(key: string, selected: boolean)</td><td></td></tr><tr><td>itemSelectAll</td><td>\u52FE\u9009\u4E00\u7EC4\u6761\u76EE</td><td>(keys: string[], selected: boolean)</td><td></td></tr></tbody></table><h4 id="\u53C2\u8003\u793A\u4F8B">\u53C2\u8003\u793A\u4F8B</h4><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-transfer</span><span class="token punctuation">&gt;</span></span>
    1376. 

  1376.   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span>
    1377. 

  1377.     <span class="token attr-name">#children</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{
    1378. 

  1378.       direction,
    1379. 

  1379.       filteredItems,
    1380. 

  1380.       selectedKeys,
    1381. 

  1381.       disabled: listDisabled,
    1382. 

  1382.       onItemSelectAll,
    1383. 

  1383.       onItemSelect,
    1384. 

  1384.     }<span class="token punctuation">&quot;</span></span>
    1385. 

  1385.   <span class="token punctuation">&gt;</span></span>
    1386. 

  1386.     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>your-component</span> <span class="token punctuation">/&gt;</span></span>
    1387. 

  1387.   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
    1388. 

  1388. <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-transfer</span><span class="token punctuation">&gt;</span></span>
    1389. 

  1389. </code></pre><h2 id="\u6CE8\u610F">\u6CE8\u610F</h2><p>\u6309\u7167 Vue \u6700\u65B0\u7684\u89C4\u8303\uFF0C\u6240\u6709\u7684\u7EC4\u4EF6\u6570\u7EC4\u6700\u597D\u7ED1\u5B9A key\u3002\u5728 Transfer \u4E2D\uFF0C<code>dataSource</code>\u91CC\u7684\u6570\u636E\u503C\u9700\u8981\u6307\u5B9A <code>key</code> \u503C\u3002\u5BF9\u4E8E <code>dataSource</code> \u9ED8\u8BA4\u5C06\u6BCF\u5217\u6570\u636E\u7684 <code>key</code> \u5C5E\u6027\u4F5C\u4E3A\u552F\u4E00\u7684\u6807\u8BC6\u3002</p><p>\u5982\u679C\u4F60\u7684\u6570\u636E\u6CA1\u6709\u8FD9\u4E2A\u5C5E\u6027\uFF0C\u52A1\u5FC5\u4F7F\u7528 <code>rowKey</code> \u6765\u6307\u5B9A\u6570\u636E\u5217\u7684\u4E3B\u952E\u3002</p><pre class="language-jsx"><code><span class="token comment">// \u6BD4\u5982\u4F60\u7684\u6570\u636E\u4E3B\u952E\u662F uid</span>
    1390. 

  1390. <span class="token keyword">return</span> <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span><span class="token class-name">Transfer</span></span> <span class="token attr-name">:rowKey</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>record =&gt; record.uid<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span><span class="token punctuation">;</span>
    1391. 

  1391. </code></pre>`,17)]))}var Sn=b(wn,[["render",vn]]);const Vn={pageData:{title:"Transfer",description:"",frontmatter:{category:"Components",type:"Data Entry",title:"Transfer",cover:"https://gw.alipayobjects.com/zos/alicdn/QAXskNI4G/Transfer.svg"},headers:[{level:2,title:"When To Use",slug:"when-to-use",content:""},{level:2,title:"API",slug:"api",content:""},{level:3,title:"events",slug:"events",content:""},{level:3,title:"Render Props",slug:"render-props",content:"Transfer accept `children` to customize render list, using follow props:"},{level:2,title:"Warning",slug:"warning",content:"According the standard of Vue, the key should always be supplied directly to the elements in the array. In Transfer, the keys should be set on the elements included in `dataSource` array. By default, `key` property is used as an unique identifier."}],relativePath:"src/docs/transfer/index.en-US.md",content:`
    1392. 

  1392. Alert component for feedback.
    1393. 

  1393. 

  1394. ## When To Use
    1395. 

  1395. 

  1396. - When you need to show alert messages to users.
    1397. 

  1397. - When you need a persistent static container which is closable by user actions.
    1398. 

  1398. 

  1399. ## API
    1400. 

  1400. 

  1401. | Property | Description | Type | Default | Version |
    1402. 

  1402. | --- | --- | --- | --- | --- |
    1403. 

  1403. | dataSource | Used for setting the source data. The elements that are part of this array will be present the left column. Except the elements whose keys are included in \`targetKeys\` prop. | \\[{key: string.isRequired,title: string.isRequired,description: string,disabled: bool}\\] | \\[] |  |
    1404. 

  1404. | disabled | Whether disabled transfer | boolean | false |  |
    1405. 

  1405. | filterOption | A function to determine whether an item should show in search result list | (inputValue, option): boolean |  |  |
    1406. 

  1406. | footer | customize the progress dot by setting a scoped slot | slot=&quot;footer&quot; slot-scope=&quot;props&quot; |  |  |
    1407. 

  1407. | lazy | property of vc-lazy-load for lazy rendering items. Turn off it by set to \`false\`. | object\\|boolean | \`{ height: 32, offset: 32 }\` |  |
    1408. 

  1408. | listStyle | A custom CSS style used for rendering the transfer columns. | object |  |  |
    1409. 

  1409. | locale | i18n text including filter, empty text, item unit, etc | object | \`{ itemUnit: &#39;item&#39;, itemsUnit: &#39;items&#39;, notFoundContent: &#39;The list is empty&#39;, searchPlaceholder: &#39;Search here&#39; }\` |  |
    1410. 

  1410. | operations | A set of operations that are sorted from top to bottom. | string\\[] | \\[&#39;&gt;&#39;, &#39;&lt;&#39;] |  |
    1411. 

  1411. | render | The function to generate the item shown on a column. Based on an record (element of the dataSource array), this function should return a element which is generated from that record. Also, it can return a plain object with \`value\` and \`label\`, \`label\` is a element and \`value\` is for title | Function(record) \\| slot |  |  |
    1412. 

  1412. | selectedKeys | A set of keys of selected items. | string\\[] | \\[] |  |
    1413. 

  1413. | showSearch | If included, a search box is shown on each column. | boolean | false |  |
    1414. 

  1414. | showSelectAll | Show select all checkbox on the header | boolean | true |  |
    1415. 

  1415. | targetKeys | A set of keys of elements that are listed on the right column. | string\\[] | \\[] |  |
    1416. 

  1416. | titles | A set of titles that are sorted from left to right. | string\\[] | - |  |
    1417. 

  1417. 

  1418. ### events
    1419. 

  1419. 

  1420. | Events Name | Description | Arguments | Version |
    1421. 

  1421. | --- | --- | --- | --- |
    1422. 

  1422. | change | A callback function that is executed when the transfer between columns is complete. | (targetKeys, direction, moveKeys): void |  |
    1423. 

  1423. | scroll | A callback function which is executed when scroll options list | (direction, event): void |  |
    1424. 

  1424. | search | A callback function which is executed when search field are changed | (direction: &#39;left&#39;\\|&#39;right&#39;, value: string): void | - |
    1425. 

  1425. | selectChange | A callback function which is executed when selected items are changed. | (sourceSelectedKeys, targetSelectedKeys): void |  |
    1426. 

  1426. 

  1427. ### Render Props
    1428. 

  1428. 

  1429. Transfer accept \`children\` to customize render list, using follow props:
    1430. 

  1430. 

  1431. \`\`\`json
    1432. 

  1432. {
    1433. 

  1433.   &quot;direction&quot;: String,
    1434. 

  1434.   &quot;disabled&quot;: Boolean,
    1435. 

  1435.   &quot;filteredItems&quot;: Array,
    1436. 

  1436.   &quot;selectedKeys&quot;: Array,
    1437. 

  1437.   &quot;onItemSelect&quot;: Function,
    1438. 

  1438.   &quot;onItemSelectAll&quot;: Function
    1439. 

  1439. }
    1440. 

  1440. \`\`\`
    1441. 

  1441. 

  1442. | Property        | Description             | Type                                | Version |
    1443. 

  1443. | --------------- | ----------------------- | ----------------------------------- | ------- |
    1444. 

  1444. | direction       | List render direction   | &#39;left&#39; \\| &#39;right&#39;                   |         |
    1445. 

  1445. | disabled        | Disable list or not     | boolean                             |         |
    1446. 

  1446. | filteredItems   | Filtered items          | TransferItem[]                      |         |
    1447. 

  1447. | onItemSelect    | Select item             | (key: string, selected: boolean)    |         |
    1448. 

  1448. | onItemSelectAll | Select a group of items | (keys: string[], selected: boolean) |         |
    1449. 

  1449. | selectedKeys    | Selected items          | string[]                            |         |
    1450. 

  1450. 

  1451. #### example
    1452. 

  1452. 

  1453. \`\`\`html
    1454. 

  1454. &lt;a-transfer&gt;
    1455. 

  1455.   &lt;template
    1456. 

  1456.     #children=&quot;{
    1457. 

  1457.       direction,
    1458. 

  1458.       filteredItems,
    1459. 

  1459.       selectedKeys,
    1460. 

  1460.       disabled: listDisabled,
    1461. 

  1461.       onItemSelectAll,
    1462. 

  1462.       onItemSelect,
    1463. 

  1463.     }&quot;
    1464. 

  1464.   &gt;
    1465. 

  1465.     &lt;your-component /&gt;
    1466. 

  1466.   &lt;template&gt;
    1467. 

  1467. &lt;/a-transfer&gt;
    1468. 

  1468. \`\`\`
    1469. 

  1469. 

  1470. ## Warning
    1471. 

  1471. 

  1472. According the standard of Vue, the key should always be supplied directly to the elements in the array. In Transfer, the keys should be set on the elements included in \`dataSource\` array. By default, \`key\` property is used as an unique identifier.
    1473. 

  1473. 

  1474. If there&#39;s no \`key\` in your data, you should use \`rowKey\` to specify the key that will be used for uniquely identify each element.
    1475. 

  1475. 

  1476. \`\`\`jsx
    1477. 

  1477. // eg. your primary key is \`uid\`
    1478. 

  1478. return &lt;Transfer :rowKey=&quot;record =&gt; record.uid&quot; /&gt;;
    1479. 

  1479. \`\`\`
    1480. 

  1480. `,html:`<p>Alert component for feedback.</p>
    1481. 

  1481. <h2 id="when-to-use">When To Use</h2>
    1482. 

  1482. <ul>
    1483. 

  1483. <li>When you need to show alert messages to users.</li>
    1484. 

  1484. <li>When you need a persistent static container which is closable by user actions.</li>
    1485. 

  1485. </ul>
    1486. 

  1486. <h2 id="api">API</h2>
    1487. 

  1487. <table>
    1488. 

  1488. <thead>
    1489. 

  1489. <tr>
    1490. 

  1490. <th>Property</th>
    1491. 

  1491. <th>Description</th>
    1492. 

  1492. <th>Type</th>
    1493. 

  1493. <th>Default</th>
    1494. 

  1494. <th>Version</th>
    1495. 

  1495. </tr>
    1496. 

  1496. </thead>
    1497. 

  1497. <tbody>
    1498. 

  1498. <tr>
    1499. 

  1499. <td>dataSource</td>
    1500. 

  1500. <td>Used for setting the source data. The elements that are part of this array will be present the left column. Except the elements whose keys are included in <code>targetKeys</code> prop.</td>
    1501. 

  1501. <td>[{key: string.isRequired,title: string.isRequired,description: string,disabled: bool}]</td>
    1502. 

  1502. <td>[]</td>
    1503. 

  1503. <td></td>
    1504. 

  1504. </tr>
    1505. 

  1505. <tr>
    1506. 

  1506. <td>disabled</td>
    1507. 

  1507. <td>Whether disabled transfer</td>
    1508. 

  1508. <td>boolean</td>
    1509. 

  1509. <td>false</td>
    1510. 

  1510. <td></td>
    1511. 

  1511. </tr>
    1512. 

  1512. <tr>
    1513. 

  1513. <td>filterOption</td>
    1514. 

  1514. <td>A function to determine whether an item should show in search result list</td>
    1515. 

  1515. <td>(inputValue, option): boolean</td>
    1516. 

  1516. <td></td>
    1517. 

  1517. <td></td>
    1518. 

  1518. </tr>
    1519. 

  1519. <tr>
    1520. 

  1520. <td>footer</td>
    1521. 

  1521. <td>customize the progress dot by setting a scoped slot</td>
    1522. 

  1522. <td>slot=&quot;footer&quot; slot-scope=&quot;props&quot;</td>
    1523. 

  1523. <td></td>
    1524. 

  1524. <td></td>
    1525. 

  1525. </tr>
    1526. 

  1526. <tr>
    1527. 

  1527. <td>lazy</td>
    1528. 

  1528. <td>property of vc-lazy-load for lazy rendering items. Turn off it by set to <code>false</code>.</td>
    1529. 

  1529. <td>object|boolean</td>
    1530. 

  1530. <td><code>{ height: 32, offset: 32 }</code></td>
    1531. 

  1531. <td></td>
    1532. 

  1532. </tr>
    1533. 

  1533. <tr>
    1534. 

  1534. <td>listStyle</td>
    1535. 

  1535. <td>A custom CSS style used for rendering the transfer columns.</td>
    1536. 

  1536. <td>object</td>
    1537. 

  1537. <td></td>
    1538. 

  1538. <td></td>
    1539. 

  1539. </tr>
    1540. 

  1540. <tr>
    1541. 

  1541. <td>locale</td>
    1542. 

  1542. <td>i18n text including filter, empty text, item unit, etc</td>
    1543. 

  1543. <td>object</td>
    1544. 

  1544. <td><code>{ itemUnit: 'item', itemsUnit: 'items', notFoundContent: 'The list is empty', searchPlaceholder: 'Search here' }</code></td>
    1545. 

  1545. <td></td>
    1546. 

  1546. </tr>
    1547. 

  1547. <tr>
    1548. 

  1548. <td>operations</td>
    1549. 

  1549. <td>A set of operations that are sorted from top to bottom.</td>
    1550. 

  1550. <td>string[]</td>
    1551. 

  1551. <td>['&gt;', '&lt;']</td>
    1552. 

  1552. <td></td>
    1553. 

  1553. </tr>
    1554. 

  1554. <tr>
    1555. 

  1555. <td>render</td>
    1556. 

  1556. <td>The function to generate the item shown on a column. Based on an record (element of the dataSource array), this function should return a element which is generated from that record. Also, it can return a plain object with <code>value</code> and <code>label</code>, <code>label</code> is a element and <code>value</code> is for title</td>
    1557. 

  1557. <td>Function(record) | slot</td>
    1558. 

  1558. <td></td>
    1559. 

  1559. <td></td>
    1560. 

  1560. </tr>
    1561. 

  1561. <tr>
    1562. 

  1562. <td>selectedKeys</td>
    1563. 

  1563. <td>A set of keys of selected items.</td>
    1564. 

  1564. <td>string[]</td>
    1565. 

  1565. <td>[]</td>
    1566. 

  1566. <td></td>
    1567. 

  1567. </tr>
    1568. 

  1568. <tr>
    1569. 

  1569. <td>showSearch</td>
    1570. 

  1570. <td>If included, a search box is shown on each column.</td>
    1571. 

  1571. <td>boolean</td>
    1572. 

  1572. <td>false</td>
    1573. 

  1573. <td></td>
    1574. 

  1574. </tr>
    1575. 

  1575. <tr>
    1576. 

  1576. <td>showSelectAll</td>
    1577. 

  1577. <td>Show select all checkbox on the header</td>
    1578. 

  1578. <td>boolean</td>
    1579. 

  1579. <td>true</td>
    1580. 

  1580. <td></td>
    1581. 

  1581. </tr>
    1582. 

  1582. <tr>
    1583. 

  1583. <td>targetKeys</td>
    1584. 

  1584. <td>A set of keys of elements that are listed on the right column.</td>
    1585. 

  1585. <td>string[]</td>
    1586. 

  1586. <td>[]</td>
    1587. 

  1587. <td></td>
    1588. 

  1588. </tr>
    1589. 

  1589. <tr>
    1590. 

  1590. <td>titles</td>
    1591. 

  1591. <td>A set of titles that are sorted from left to right.</td>
    1592. 

  1592. <td>string[]</td>
    1593. 

  1593. <td>-</td>
    1594. 

  1594. <td></td>
    1595. 

  1595. </tr>
    1596. 

  1596. </tbody>
    1597. 

  1597. </table>
    1598. 

  1598. <h3 id="events">events</h3>
    1599. 

  1599. <table>
    1600. 

  1600. <thead>
    1601. 

  1601. <tr>
    1602. 

  1602. <th>Events Name</th>
    1603. 

  1603. <th>Description</th>
    1604. 

  1604. <th>Arguments</th>
    1605. 

  1605. <th>Version</th>
    1606. 

  1606. </tr>
    1607. 

  1607. </thead>
    1608. 

  1608. <tbody>
    1609. 

  1609. <tr>
    1610. 

  1610. <td>change</td>
    1611. 

  1611. <td>A callback function that is executed when the transfer between columns is complete.</td>
    1612. 

  1612. <td>(targetKeys, direction, moveKeys): void</td>
    1613. 

  1613. <td></td>
    1614. 

  1614. </tr>
    1615. 

  1615. <tr>
    1616. 

  1616. <td>scroll</td>
    1617. 

  1617. <td>A callback function which is executed when scroll options list</td>
    1618. 

  1618. <td>(direction, event): void</td>
    1619. 

  1619. <td></td>
    1620. 

  1620. </tr>
    1621. 

  1621. <tr>
    1622. 

  1622. <td>search</td>
    1623. 

  1623. <td>A callback function which is executed when search field are changed</td>
    1624. 

  1624. <td>(direction: 'left'|'right', value: string): void</td>
    1625. 

  1625. <td>-</td>
    1626. 

  1626. </tr>
    1627. 

  1627. <tr>
    1628. 

  1628. <td>selectChange</td>
    1629. 

  1629. <td>A callback function which is executed when selected items are changed.</td>
    1630. 

  1630. <td>(sourceSelectedKeys, targetSelectedKeys): void</td>
    1631. 

  1631. <td></td>
    1632. 

  1632. </tr>
    1633. 

  1633. </tbody>
    1634. 

  1634. </table>
    1635. 

  1635. <h3 id="render-props">Render Props</h3>
    1636. 

  1636. <p>Transfer accept <code>children</code> to customize render list, using follow props:</p>
    1637. 

  1637. <pre class="language-json" v-pre><code><span class="token punctuation">{</span>
    1638. 

  1638.   <span class="token property">"direction"</span><span class="token operator">:</span> String<span class="token punctuation">,</span>
    1639. 

  1639.   <span class="token property">"disabled"</span><span class="token operator">:</span> Boolean<span class="token punctuation">,</span>
    1640. 

  1640.   <span class="token property">"filteredItems"</span><span class="token operator">:</span> Array<span class="token punctuation">,</span>
    1641. 

  1641.   <span class="token property">"selectedKeys"</span><span class="token operator">:</span> Array<span class="token punctuation">,</span>
    1642. 

  1642.   <span class="token property">"onItemSelect"</span><span class="token operator">:</span> Function<span class="token punctuation">,</span>
    1643. 

  1643.   <span class="token property">"onItemSelectAll"</span><span class="token operator">:</span> Function
    1644. 

  1644. <span class="token punctuation">}</span>
    1645. 

  1645. </code></pre>
    1646. 

  1646. <table>
    1647. 

  1647. <thead>
    1648. 

  1648. <tr>
    1649. 

  1649. <th>Property</th>
    1650. 

  1650. <th>Description</th>
    1651. 

  1651. <th>Type</th>
    1652. 

  1652. <th>Version</th>
    1653. 

  1653. </tr>
    1654. 

  1654. </thead>
    1655. 

  1655. <tbody>
    1656. 

  1656. <tr>
    1657. 

  1657. <td>direction</td>
    1658. 

  1658. <td>List render direction</td>
    1659. 

  1659. <td>'left' | 'right'</td>
    1660. 

  1660. <td></td>
    1661. 

  1661. </tr>
    1662. 

  1662. <tr>
    1663. 

  1663. <td>disabled</td>
    1664. 

  1664. <td>Disable list or not</td>
    1665. 

  1665. <td>boolean</td>
    1666. 

  1666. <td></td>
    1667. 

  1667. </tr>
    1668. 

  1668. <tr>
    1669. 

  1669. <td>filteredItems</td>
    1670. 

  1670. <td>Filtered items</td>
    1671. 

  1671. <td>TransferItem[]</td>
    1672. 

  1672. <td></td>
    1673. 

  1673. </tr>
    1674. 

  1674. <tr>
    1675. 

  1675. <td>onItemSelect</td>
    1676. 

  1676. <td>Select item</td>
    1677. 

  1677. <td>(key: string, selected: boolean)</td>
    1678. 

  1678. <td></td>
    1679. 

  1679. </tr>
    1680. 

  1680. <tr>
    1681. 

  1681. <td>onItemSelectAll</td>
    1682. 

  1682. <td>Select a group of items</td>
    1683. 

  1683. <td>(keys: string[], selected: boolean)</td>
    1684. 

  1684. <td></td>
    1685. 

  1685. </tr>
    1686. 

  1686. <tr>
    1687. 

  1687. <td>selectedKeys</td>
    1688. 

  1688. <td>Selected items</td>
    1689. 

  1689. <td>string[]</td>
    1690. 

  1690. <td></td>
    1691. 

  1691. </tr>
    1692. 

  1692. </tbody>
    1693. 

  1693. </table>
    1694. 

  1694. <h4 id="example">example</h4>
    1695. 

  1695. <pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-transfer</span><span class="token punctuation">></span></span>
    1696. 

  1696.   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span>
    1697. 

  1697.     <span class="token attr-name">#children</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{
    1698. 

  1698.       direction,
    1699. 

  1699.       filteredItems,
    1700. 

  1700.       selectedKeys,
    1701. 

  1701.       disabled: listDisabled,
    1702. 

  1702.       onItemSelectAll,
    1703. 

  1703.       onItemSelect,
    1704. 

  1704.     }<span class="token punctuation">"</span></span>
    1705. 

  1705.   <span class="token punctuation">></span></span>
    1706. 

  1706.     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>your-component</span> <span class="token punctuation">/></span></span>
    1707. 

  1707.   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">></span></span>
    1708. 

  1708. <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-transfer</span><span class="token punctuation">></span></span>
    1709. 

  1709. </code></pre>
    1710. 

  1710. <h2 id="warning">Warning</h2>
    1711. 

  1711. <p>According the standard of Vue, the key should always be supplied directly to the elements in the array. In Transfer, the keys should be set on the elements included in <code>dataSource</code> array. By default, <code>key</code> property is used as an unique identifier.</p>
    1712. 

  1712. <p>If there's no <code>key</code> in your data, you should use <code>rowKey</code> to specify the key that will be used for uniquely identify each element.</p>
    1713. 

  1713. <pre class="language-jsx" v-pre><code><span class="token comment">// eg. your primary key is \`uid\`</span>
    1714. 

  1714. <span class="token keyword">return</span> <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span><span class="token class-name">Transfer</span></span> <span class="token attr-name">:rowKey</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>record => record.uid<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span><span class="token punctuation">;</span>
    1715. 

  1715. </code></pre>
    1716. 

  1716. `,lastUpdated:1748059052780}},Wn={class:"markdown"};function Rn(s,a,p,I,l,u){return h(),B("article",Wn,a[0]||(a[0]=[Y(`<p>Alert component for feedback.</p><h2 id="when-to-use">When To Use</h2><ul><li>When you need to show alert messages to users.</li><li>When you need a persistent static container which is closable by user actions.</li></ul><h2 id="api">API</h2><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th><th>Version</th></tr></thead><tbody><tr><td>dataSource</td><td>Used for setting the source data. The elements that are part of this array will be present the left column. Except the elements whose keys are included in <code>targetKeys</code> prop.</td><td>[{key: string.isRequired,title: string.isRequired,description: string,disabled: bool}]</td><td>[]</td><td></td></tr><tr><td>disabled</td><td>Whether disabled transfer</td><td>boolean</td><td>false</td><td></td></tr><tr><td>filterOption</td><td>A function to determine whether an item should show in search result list</td><td>(inputValue, option): boolean</td><td></td><td></td></tr><tr><td>footer</td><td>customize the progress dot by setting a scoped slot</td><td>slot=&quot;footer&quot; slot-scope=&quot;props&quot;</td><td></td><td></td></tr><tr><td>lazy</td><td>property of vc-lazy-load for lazy rendering items. Turn off it by set to <code>false</code>.</td><td>object|boolean</td><td><code>{ height: 32, offset: 32 }</code></td><td></td></tr><tr><td>listStyle</td><td>A custom CSS style used for rendering the transfer columns.</td><td>object</td><td></td><td></td></tr><tr><td>locale</td><td>i18n text including filter, empty text, item unit, etc</td><td>object</td><td><code>{ itemUnit: &#39;item&#39;, itemsUnit: &#39;items&#39;, notFoundContent: &#39;The list is empty&#39;, searchPlaceholder: &#39;Search here&#39; }</code></td><td></td></tr><tr><td>operations</td><td>A set of operations that are sorted from top to bottom.</td><td>string[]</td><td>[&#39;&gt;&#39;, &#39;&lt;&#39;]</td><td></td></tr><tr><td>render</td><td>The function to generate the item shown on a column. Based on an record (element of the dataSource array), this function should return a element which is generated from that record. Also, it can return a plain object with <code>value</code> and <code>label</code>, <code>label</code> is a element and <code>value</code> is for title</td><td>Function(record) | slot</td><td></td><td></td></tr><tr><td>selectedKeys</td><td>A set of keys of selected items.</td><td>string[]</td><td>[]</td><td></td></tr><tr><td>showSearch</td><td>If included, a search box is shown on each column.</td><td>boolean</td><td>false</td><td></td></tr><tr><td>showSelectAll</td><td>Show select all checkbox on the header</td><td>boolean</td><td>true</td><td></td></tr><tr><td>targetKeys</td><td>A set of keys of elements that are listed on the right column.</td><td>string[]</td><td>[]</td><td></td></tr><tr><td>titles</td><td>A set of titles that are sorted from left to right.</td><td>string[]</td><td>-</td><td></td></tr></tbody></table><h3 id="events">events</h3><table><thead><tr><th>Events Name</th><th>Description</th><th>Arguments</th><th>Version</th></tr></thead><tbody><tr><td>change</td><td>A callback function that is executed when the transfer between columns is complete.</td><td>(targetKeys, direction, moveKeys): void</td><td></td></tr><tr><td>scroll</td><td>A callback function which is executed when scroll options list</td><td>(direction, event): void</td><td></td></tr><tr><td>search</td><td>A callback function which is executed when search field are changed</td><td>(direction: &#39;left&#39;|&#39;right&#39;, value: string): void</td><td>-</td></tr><tr><td>selectChange</td><td>A callback function which is executed when selected items are changed.</td><td>(sourceSelectedKeys, targetSelectedKeys): void</td><td></td></tr></tbody></table><h3 id="render-props">Render Props</h3><p>Transfer accept <code>children</code> to customize render list, using follow props:</p><pre class="language-json"><code><span class="token punctuation">{</span>
    1717. 

  1717.   <span class="token property">&quot;direction&quot;</span><span class="token operator">:</span> String<span class="token punctuation">,</span>
    1718. 

  1718.   <span class="token property">&quot;disabled&quot;</span><span class="token operator">:</span> Boolean<span class="token punctuation">,</span>
    1719. 

  1719.   <span class="token property">&quot;filteredItems&quot;</span><span class="token operator">:</span> Array<span class="token punctuation">,</span>
    1720. 

  1720.   <span class="token property">&quot;selectedKeys&quot;</span><span class="token operator">:</span> Array<span class="token punctuation">,</span>
    1721. 

  1721.   <span class="token property">&quot;onItemSelect&quot;</span><span class="token operator">:</span> Function<span class="token punctuation">,</span>
    1722. 

  1722.   <span class="token property">&quot;onItemSelectAll&quot;</span><span class="token operator">:</span> Function
    1723. 

  1723. <span class="token punctuation">}</span>
    1724. 

  1724. </code></pre><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Version</th></tr></thead><tbody><tr><td>direction</td><td>List render direction</td><td>&#39;left&#39; | &#39;right&#39;</td><td></td></tr><tr><td>disabled</td><td>Disable list or not</td><td>boolean</td><td></td></tr><tr><td>filteredItems</td><td>Filtered items</td><td>TransferItem[]</td><td></td></tr><tr><td>onItemSelect</td><td>Select item</td><td>(key: string, selected: boolean)</td><td></td></tr><tr><td>onItemSelectAll</td><td>Select a group of items</td><td>(keys: string[], selected: boolean)</td><td></td></tr><tr><td>selectedKeys</td><td>Selected items</td><td>string[]</td><td></td></tr></tbody></table><h4 id="example">example</h4><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-transfer</span><span class="token punctuation">&gt;</span></span>
    1725. 

  1725.   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span>
    1726. 

  1726.     <span class="token attr-name">#children</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{
    1727. 

  1727.       direction,
    1728. 

  1728.       filteredItems,
    1729. 

  1729.       selectedKeys,
    1730. 

  1730.       disabled: listDisabled,
    1731. 

  1731.       onItemSelectAll,
    1732. 

  1732.       onItemSelect,
    1733. 

  1733.     }<span class="token punctuation">&quot;</span></span>
    1734. 

  1734.   <span class="token punctuation">&gt;</span></span>
    1735. 

  1735.     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>your-component</span> <span class="token punctuation">/&gt;</span></span>
    1736. 

  1736.   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
    1737. 

  1737. <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-transfer</span><span class="token punctuation">&gt;</span></span>
    1738. 

  1738. </code></pre><h2 id="warning">Warning</h2><p>According the standard of Vue, the key should always be supplied directly to the elements in the array. In Transfer, the keys should be set on the elements included in <code>dataSource</code> array. By default, <code>key</code> property is used as an unique identifier.</p><p>If there&#39;s no <code>key</code> in your data, you should use <code>rowKey</code> to specify the key that will be used for uniquely identify each element.</p><pre class="language-jsx"><code><span class="token comment">// eg. your primary key is \`uid\`</span>
    1739. 

  1739. <span class="token keyword">return</span> <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span><span class="token class-name">Transfer</span></span> <span class="token attr-name">:rowKey</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>record =&gt; record.uid<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span><span class="token punctuation">;</span>
    1740. 

  1740. </code></pre>`,17)]))}var Xn=b(Vn,[["render",Rn]]);const Bn=G({CN:Sn,US:Xn,components:{Basic:an,Search:cn,Advanced:un,CustomItem:gn,TableTransfer:hn,TreeTransfer:fn},setup(){return{}}});function Yn(s,a,p,I,l,u){const o=r("basic"),e=r("search"),c=r("advanced"),i=r("custom-item"),d=r("table-transfer"),g=r("tree-transfer"),m=r("demo-sort");return h(),Z(m,{cols:1},{default:k(()=>[C(o),C(e),C(c),C(i),C(d),C(g)]),_:1})}var Dn=b(Bn,[["render",Yn]]);export{Dn as default};
    1741.