import{d as h,r as i,_ as A,j as p,k as b,l as W,w as e,f as o,b as n,e as a,az as S,s as x,c as P,O as X,t as F,a as G,n as Y}from"./index.c1b9962e.js";import{U as N}from"./UserOutlined.f4b09e7f.js";import{S as z}from"./SettingOutlined.83c252fc.js";const L=h({setup(){return{value:i("")}}});function K(s,t,I,d,r,v){const c=p("a-input"),k=p("demo-box");return b(),W(k,{jsfiddle:{us:"Basic usage example.",cn:"\u57FA\u672C\u7528\u6CD5\u3002",docHtml:`

zh-CN

\u57FA\u672C\u7528\u6CD5\u3002

en-US

Basic usage example.

`,order:0,title:{"zh-CN":"\u57FA\u672C\u7528\u6CD5","en-US":"Basic usage"},relativePath:"src/docs/input/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWlucHV0IHYtbW9kZWw6dmFsdWU9InZhbHVlIiBwbGFjZWhvbGRlcj0iQmFzaWMgdXNhZ2UiIC8+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZSA9IHJlZjxzdHJpbmc+KCcnKTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWlucHV0IHYtbW9kZWw6dmFsdWU9InZhbHVlIiBwbGFjZWhvbGRlcj0iQmFzaWMgdXNhZ2UiIC8+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHZhbHVlID0gcmVmKCcnKTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:e(()=>[o(c,{value:s.value,"onUpdate:value":t[0]||(t[0]=u=>s.value=u),placeholder:"Basic usage"},null,8,["value"])]),htmlCode:e(()=>t[1]||(t[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-input")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Basic usage"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),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"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(` `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token keyword"},"const"),a(" value "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(` value`),n("span",{class:"token punctuation"},","),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `)])],-1)])),jsVersionHtml:e(()=>t[2]||(t[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-input")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Basic usage"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(` `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token keyword"},"const"),a(" value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(` value`),n("span",{class:"token punctuation"},","),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `)])],-1)])),_:1})}var D=A(L,[["render",K]]);const J=h({setup(){const s=i(""),t=i("");return{value1:s,value2:t}}});function j(s,t,I,d,r,v){const c=p("a-textarea"),k=p("demo-box");return b(),W(k,{jsfiddle:{us:"`autoSize` prop for a `textarea` type of `Input` makes the height to automatically adjust based on the content. An options object can be provided to `autoSize` to specify the minimum and maximum number of lines the textarea will automatically adjust.",cn:"\u5C5E\u6027\u9002\u7528\u4E8E `textarea` \u8282\u70B9\uFF0C\u5E76\u4E14\u53EA\u6709\u9AD8\u5EA6\u4F1A\u81EA\u52A8\u53D8\u5316\u3002\u53E6\u5916 `autoSize` \u53EF\u4EE5\u8BBE\u5B9A\u4E3A\u4E00\u4E2A\u5BF9\u8C61\uFF0C\u6307\u5B9A\u6700\u5C0F\u884C\u6570\u548C\u6700\u5927\u884C\u6570\u3002",docHtml:`

zh-CN

\u5C5E\u6027\u9002\u7528\u4E8E textarea \u8282\u70B9\uFF0C\u5E76\u4E14\u53EA\u6709\u9AD8\u5EA6\u4F1A\u81EA\u52A8\u53D8\u5316\u3002\u53E6\u5916 autoSize \u53EF\u4EE5\u8BBE\u5B9A\u4E3A\u4E00\u4E2A\u5BF9\u8C61\uFF0C\u6307\u5B9A\u6700\u5C0F\u884C\u6570\u548C\u6700\u5927\u884C\u6570\u3002

1.5.0 \u540E autosize \u88AB\u5E9F\u5F03\uFF0C\u8BF7\u4F7F\u7528 autoSize\u3002

en-US

autoSize prop for a textarea type of Input makes the height to automatically adjust based on the content. An options object can be provided to autoSize to specify the minimum and maximum number of lines the textarea will automatically adjust.

autosize is deprecated after 1.5.0, please use autoSize.

`,order:9,title:{"zh-CN":"\u8F93\u5165\u65F6\u683C\u5F0F\u5316\u5C55\u793A","en-US":"Format Tooltip Input"},relativePath:"src/docs/input/demo/tooltip.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRvb2x0aXAgOnRyaWdnZXI9IlsnZm9jdXMnXSIgcGxhY2VtZW50PSJ0b3BMZWZ0IiBvdmVybGF5LWNsYXNzLW5hbWU9Im51bWVyaWMtaW5wdXQiPgogICAgPHRlbXBsYXRlIHYtaWY9ImlucHV0VmFsdWUiICN0aXRsZT4KICAgICAgPHNwYW4gY2xhc3M9Im51bWVyaWMtaW5wdXQtdGl0bGUiPgogICAgICAgIHt7IGZvcm1hdFZhbHVlIH19CiAgICAgIDwvc3Bhbj4KICAgIDwvdGVtcGxhdGU+CgogICAgPGEtaW5wdXQKICAgICAgdi1tb2RlbDp2YWx1ZT0iaW5wdXRWYWx1ZSIKICAgICAgcGxhY2Vob2xkZXI9IklucHV0IGEgbnVtYmVyIgogICAgICA6bWF4LWxlbmd0aD0iMjUiCiAgICAgIHN0eWxlPSJ3aWR0aDogMTIwcHgiCiAgICAgIEBibHVyPSJvbkJsdXIiCiAgICAvPgogIDwvYS10b29sdGlwPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgY29tcHV0ZWQsIGRlZmluZUNvbXBvbmVudCwgcmVmLCB3YXRjaCB9IGZyb20gJ3Z1ZSc7CgpmdW5jdGlvbiBmb3JtYXROdW1iZXIodmFsdWU6IHN0cmluZykgewogIHZhbHVlICs9ICcnOwogIGNvbnN0IGxpc3QgPSB2YWx1ZS5zcGxpdCgnLicpOwogIGNvbnN0IHByZWZpeCA9IGxpc3RbMF0uY2hhckF0KDApID09PSAnLScgPyAnLScgOiAnJzsKICBsZXQgbnVtID0gcHJlZml4ID8gbGlzdFswXS5zbGljZSgxKSA6IGxpc3RbMF07CiAgbGV0IHJlc3VsdCA9ICcnOwoKICB3aGlsZSAobnVtLmxlbmd0aCA+IDMpIHsKICAgIHJlc3VsdCA9IGAsJHtudW0uc2xpY2UoLTMpfSR7cmVzdWx0fWA7CiAgICBudW0gPSBudW0uc2xpY2UoMCwgbnVtLmxlbmd0aCAtIDMpOwogIH0KCiAgaWYgKG51bSkgewogICAgcmVzdWx0ID0gbnVtICsgcmVzdWx0OwogIH0KCiAgcmV0dXJuIGAke3ByZWZpeH0ke3Jlc3VsdH0ke2xpc3RbMV0gPyBgLiR7bGlzdFsxXX1gIDogJyd9YDsKfQoKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IGlucHV0VmFsdWUgPSByZWY8c3RyaW5nPignMTExJyk7CiAgICBjb25zdCBmb3JtYXRWYWx1ZSA9IGNvbXB1dGVkKCgpID0+IHsKICAgICAgaWYgKGlucHV0VmFsdWUudmFsdWUgPT09ICctJykgcmV0dXJuICctJzsKICAgICAgcmV0dXJuIGZvcm1hdE51bWJlcihpbnB1dFZhbHVlLnZhbHVlKTsKICAgIH0pOwoKICAgIGNvbnN0IGZvcm1hdCA9ICh2YWw6IHN0cmluZywgcHJlVmFsOiBzdHJpbmcpID0+IHsKICAgICAgY29uc3QgcmVnID0gL14tP1xkKihcLlxkKik/JC87CgogICAgICBpZiAoKCFpc05hTigrdmFsKSAmJiByZWcudGVzdCh2YWwpKSB8fCB2YWwgPT09ICcnIHx8IHZhbCA9PT0gJy0nKSB7CiAgICAgICAgaW5wdXRWYWx1ZS52YWx1ZSA9IHZhbDsKICAgICAgfSBlbHNlIHsKICAgICAgICBpbnB1dFZhbHVlLnZhbHVlID0gcHJlVmFsOwogICAgICB9CiAgICB9OwoKICAgIC8vICcuJyBhdCB0aGUgZW5kIG9yIG9ubHkgJy0nIGluIHRoZSBpbnB1dCBib3guCiAgICBjb25zdCBvbkJsdXIgPSAoKSA9PiB7CiAgICAgIGlmICgKICAgICAgICBpbnB1dFZhbHVlLnZhbHVlLmNoYXJBdChpbnB1dFZhbHVlLnZhbHVlLmxlbmd0aCAtIDEpID09PSAnLicgfHwKICAgICAgICBpbnB1dFZhbHVlLnZhbHVlID09PSAnLScKICAgICAgKSB7CiAgICAgICAgZm9ybWF0KGlucHV0VmFsdWUudmFsdWUuc2xpY2UoMCwgLTEpLCBpbnB1dFZhbHVlLnZhbHVlKTsKICAgICAgfQogICAgfTsKCiAgICB3YXRjaChpbnB1dFZhbHVlLCAodmFsLCBwcmVWYWwpID0+IHsKICAgICAgZm9ybWF0KHZhbCwgcHJlVmFsKTsKICAgIH0pOwoKICAgIHJldHVybiB7CiAgICAgIGlucHV0VmFsdWUsCiAgICAgIG9uQmx1ciwKICAgICAgZm9ybWF0VmFsdWUsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KPHN0eWxlPgovKiB0byBwcmV2ZW50IHRoZSBhcnJvdyBvdmVyZmxvdyB0aGUgcG9wdXAgY29udGFpbmVyLApvciB0aGUgaGVpZ2h0IGlzIG5vdCBlbm91Z2ggd2hlbiBjb250ZW50IGlzIGVtcHR5ICovCi5udW1lcmljLWlucHV0IC5hbnQtdG9vbHRpcC1pbm5lciB7CiAgbWluLXdpZHRoOiAzMnB4OwogIG1pbi1oZWlnaHQ6IDM3cHg7Cn0KCi5udW1lcmljLWlucHV0IC5udW1lcmljLWlucHV0LXRpdGxlIHsKICBmb250LXNpemU6IDE0cHg7Cn0KPC9zdHlsZT4K",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRvb2x0aXAgOnRyaWdnZXI9IlsnZm9jdXMnXSIgcGxhY2VtZW50PSJ0b3BMZWZ0IiBvdmVybGF5LWNsYXNzLW5hbWU9Im51bWVyaWMtaW5wdXQiPgogICAgPHRlbXBsYXRlIHYtaWY9ImlucHV0VmFsdWUiICN0aXRsZT4KICAgICAgPHNwYW4gY2xhc3M9Im51bWVyaWMtaW5wdXQtdGl0bGUiPgogICAgICAgIHt7IGZvcm1hdFZhbHVlIH19CiAgICAgIDwvc3Bhbj4KICAgIDwvdGVtcGxhdGU+CgogICAgPGEtaW5wdXQKICAgICAgdi1tb2RlbDp2YWx1ZT0iaW5wdXRWYWx1ZSIKICAgICAgcGxhY2Vob2xkZXI9IklucHV0IGEgbnVtYmVyIgogICAgICA6bWF4LWxlbmd0aD0iMjUiCiAgICAgIHN0eWxlPSJ3aWR0aDogMTIwcHgiCiAgICAgIEBibHVyPSJvbkJsdXIiCiAgICAvPgogIDwvYS10b29sdGlwPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBjb21wdXRlZCwgZGVmaW5lQ29tcG9uZW50LCByZWYsIHdhdGNoIH0gZnJvbSAndnVlJzsKZnVuY3Rpb24gZm9ybWF0TnVtYmVyKHZhbHVlKSB7CiAgdmFsdWUgKz0gJyc7CiAgY29uc3QgbGlzdCA9IHZhbHVlLnNwbGl0KCcuJyk7CiAgY29uc3QgcHJlZml4ID0gbGlzdFswXS5jaGFyQXQoMCkgPT09ICctJyA/ICctJyA6ICcnOwogIGxldCBudW0gPSBwcmVmaXggPyBsaXN0WzBdLnNsaWNlKDEpIDogbGlzdFswXTsKICBsZXQgcmVzdWx0ID0gJyc7CiAgd2hpbGUgKG51bS5sZW5ndGggPiAzKSB7CiAgICByZXN1bHQgPSBgLCR7bnVtLnNsaWNlKC0zKX0ke3Jlc3VsdH1gOwogICAgbnVtID0gbnVtLnNsaWNlKDAsIG51bS5sZW5ndGggLSAzKTsKICB9CiAgaWYgKG51bSkgewogICAgcmVzdWx0ID0gbnVtICsgcmVzdWx0OwogIH0KICByZXR1cm4gYCR7cHJlZml4fSR7cmVzdWx0fSR7bGlzdFsxXSA/IGAuJHtsaXN0WzFdfWAgOiAnJ31gOwp9CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBpbnB1dFZhbHVlID0gcmVmKCcxMTEnKTsKICAgIGNvbnN0IGZvcm1hdFZhbHVlID0gY29tcHV0ZWQoKCkgPT4gewogICAgICBpZiAoaW5wdXRWYWx1ZS52YWx1ZSA9PT0gJy0nKSByZXR1cm4gJy0nOwogICAgICByZXR1cm4gZm9ybWF0TnVtYmVyKGlucHV0VmFsdWUudmFsdWUpOwogICAgfSk7CiAgICBjb25zdCBmb3JtYXQgPSAodmFsLCBwcmVWYWwpID0+IHsKICAgICAgY29uc3QgcmVnID0gL14tP1xkKihcLlxkKik/JC87CiAgICAgIGlmICgoIWlzTmFOKCt2YWwpICYmIHJlZy50ZXN0KHZhbCkpIHx8IHZhbCA9PT0gJycgfHwgdmFsID09PSAnLScpIHsKICAgICAgICBpbnB1dFZhbHVlLnZhbHVlID0gdmFsOwogICAgICB9IGVsc2UgewogICAgICAgIGlucHV0VmFsdWUudmFsdWUgPSBwcmVWYWw7CiAgICAgIH0KICAgIH07CgogICAgLy8gJy4nIGF0IHRoZSBlbmQgb3Igb25seSAnLScgaW4gdGhlIGlucHV0IGJveC4KICAgIGNvbnN0IG9uQmx1ciA9ICgpID0+IHsKICAgICAgaWYgKAogICAgICAgIGlucHV0VmFsdWUudmFsdWUuY2hhckF0KGlucHV0VmFsdWUudmFsdWUubGVuZ3RoIC0gMSkgPT09ICcuJyB8fAogICAgICAgIGlucHV0VmFsdWUudmFsdWUgPT09ICctJwogICAgICApIHsKICAgICAgICBmb3JtYXQoaW5wdXRWYWx1ZS52YWx1ZS5zbGljZSgwLCAtMSksIGlucHV0VmFsdWUudmFsdWUpOwogICAgICB9CiAgICB9OwogICAgd2F0Y2goaW5wdXRWYWx1ZSwgKHZhbCwgcHJlVmFsKSA9PiB7CiAgICAgIGZvcm1hdCh2YWwsIHByZVZhbCk7CiAgICB9KTsKICAgIHJldHVybiB7CiAgICAgIGlucHV0VmFsdWUsCiAgICAgIG9uQmx1ciwKICAgICAgZm9ybWF0VmFsdWUsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KPHN0eWxlPgovKiB0byBwcmV2ZW50IHRoZSBhcnJvdyBvdmVyZmxvdyB0aGUgcG9wdXAgY29udGFpbmVyLApvciB0aGUgaGVpZ2h0IGlzIG5vdCBlbm91Z2ggd2hlbiBjb250ZW50IGlzIGVtcHR5ICovCi5udW1lcmljLWlucHV0IC5hbnQtdG9vbHRpcC1pbm5lciB7CiAgbWluLXdpZHRoOiAzMnB4OwogIG1pbi1oZWlnaHQ6IDM3cHg7Cn0KCi5udW1lcmljLWlucHV0IC5udW1lcmljLWlucHV0LXRpdGxlIHsKICBmb250LXNpemU6IDE0cHg7Cn0KPC9zdHlsZT4="}},{default:e(()=>[o(k,{trigger:["focus"],placement:"topLeft","overlay-class-name":"numeric-input"},X({default:e(()=>[o(c,{value:s.inputValue,"onUpdate:value":t[0]||(t[0]=g=>s.inputValue=g),placeholder:"Input a number","max-length":25,style:{width:"120px"},onBlur:s.onBlur},null,8,["value","onBlur"])]),_:2},[s.inputValue?{name:"title",fn:e(()=>[n("span",xn,F(s.formatValue),1)]),key:"0"}:void 0]),1024)]),htmlCode:e(()=>t[1]||(t[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tooltip")]),a(),n("span",{class:"token attr-name"},":trigger"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("['focus']"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"placement"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("topLeft"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"overlay-class-name"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("numeric-input"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),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"},'"'),a("inputValue"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"#title"),n("span",{class:"token punctuation"},">")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("span")]),a(),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"},'"'),a("numeric-input-title"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(` {{ formatValue }} `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-input")]),a(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("inputValue"),n("span",{class:"token punctuation"},'"')]),a(` `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Input a number"),n("span",{class:"token punctuation"},'"')]),a(` `),n("span",{class:"token attr-name"},":max-length"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("25"),n("span",{class:"token punctuation"},'"')]),a(` `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 120px")]),n("span",{class:"token punctuation"},'"')])]),a(` `),n("span",{class:"token attr-name"},"@blur"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onBlur"),n("span",{class:"token punctuation"},'"')]),a(` `),n("span",{class:"token punctuation"},"/>")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),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"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(` `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" computed"),n("span",{class:"token punctuation"},","),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref"),n("span",{class:"token punctuation"},","),a(" watch "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"function"),a(),n("span",{class:"token function"},"formatNumber"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(" string")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` value `),n("span",{class:"token operator"},"+="),a(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"const"),a(" list "),n("span",{class:"token operator"},"="),a(" value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"split"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'.'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"const"),a(" prefix "),n("span",{class:"token operator"},"="),a(" list"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"charAt"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'-'"),a(),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token string"},"'-'"),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"let"),a(" num "),n("span",{class:"token operator"},"="),a(" prefix "),n("span",{class:"token operator"},"?"),a(" list"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"slice"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},":"),a(" list"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"let"),a(" result "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"while"),a(),n("span",{class:"token punctuation"},"("),a("num"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},">"),a(),n("span",{class:"token number"},"3"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` result `),n("span",{class:"token operator"},"="),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},","),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("num"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"slice"),n("span",{class:"token punctuation"},"("),n("span",{class:"token operator"},"-"),n("span",{class:"token number"},"3"),n("span",{class:"token punctuation"},")"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("result"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),a(` num `),n("span",{class:"token operator"},"="),a(" num"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"slice"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},","),a(" num"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"-"),a(),n("span",{class:"token number"},"3"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("num"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` result `),n("span",{class:"token operator"},"="),a(" num "),n("span",{class:"token operator"},"+"),a(" result"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("prefix"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("result"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("list"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},"]"),a(),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"."),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("list"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"''"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token keyword"},"const"),a(" inputValue "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'111'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"const"),a(" formatValue "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("inputValue"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'-'"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token string"},"'-'"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token function"},"formatNumber"),n("span",{class:"token punctuation"},"("),a("inputValue"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"format"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"val"),n("span",{class:"token operator"},":"),a(" string"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"preVal"),n("span",{class:"token operator"},":"),a(" string")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token keyword"},"const"),a(" reg "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token regex"},[n("span",{class:"token regex-delimiter"},"/"),n("span",{class:"token regex-source language-regex"},"^-?\\d*(\\.\\d*)?$"),n("span",{class:"token regex-delimiter"},"/")]),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token operator"},"!"),n("span",{class:"token function"},"isNaN"),n("span",{class:"token punctuation"},"("),n("span",{class:"token operator"},"+"),a("val"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"&&"),a(" reg"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"test"),n("span",{class:"token punctuation"},"("),a("val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"||"),a(" val "),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"''"),a(),n("span",{class:"token operator"},"||"),a(" val "),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'-'"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` inputValue`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" val"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"else"),a(),n("span",{class:"token punctuation"},"{"),a(` inputValue`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" preVal"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token comment"},"// '.' at the end or only '-' in the input box."),a(` `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"onBlur"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a(` inputValue`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"charAt"),n("span",{class:"token punctuation"},"("),a("inputValue"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"-"),a(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'.'"),a(),n("span",{class:"token operator"},"||"),a(` inputValue`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'-'"),a(` `),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token function"},"format"),n("span",{class:"token punctuation"},"("),a("inputValue"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"slice"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token operator"},"-"),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(" inputValue"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),a("inputValue"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[a("val"),n("span",{class:"token punctuation"},","),a(" preVal")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token function"},"format"),n("span",{class:"token punctuation"},"("),a("val"),n("span",{class:"token punctuation"},","),a(" preVal"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(` inputValue`),n("span",{class:"token punctuation"},","),a(` onBlur`),n("span",{class:"token punctuation"},","),a(` formatValue`),n("span",{class:"token punctuation"},","),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(` `),n("span",{class:"token comment"},`/* to prevent the arrow overflow the popup container, or the height is not enough when content is empty */`),a(` `),n("span",{class:"token selector"},".numeric-input .ant-tooltip-inner"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token property"},"min-width"),n("span",{class:"token punctuation"},":"),a(" 32px"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token property"},"min-height"),n("span",{class:"token punctuation"},":"),a(" 37px"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token selector"},".numeric-input .numeric-input-title"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),a(" 14px"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `)])],-1)])),jsVersionHtml:e(()=>t[2]||(t[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tooltip")]),a(),n("span",{class:"token attr-name"},":trigger"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("['focus']"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"placement"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("topLeft"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"overlay-class-name"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("numeric-input"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),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"},'"'),a("inputValue"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"#title"),n("span",{class:"token punctuation"},">")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("span")]),a(),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"},'"'),a("numeric-input-title"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(` {{ formatValue }} `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-input")]),a(` `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("inputValue"),n("span",{class:"token punctuation"},'"')]),a(` `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Input a number"),n("span",{class:"token punctuation"},'"')]),a(` `),n("span",{class:"token attr-name"},":max-length"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("25"),n("span",{class:"token punctuation"},'"')]),a(` `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 120px")]),n("span",{class:"token punctuation"},'"')])]),a(` `),n("span",{class:"token attr-name"},"@blur"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onBlur"),n("span",{class:"token punctuation"},'"')]),a(` `),n("span",{class:"token punctuation"},"/>")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(` `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" computed"),n("span",{class:"token punctuation"},","),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref"),n("span",{class:"token punctuation"},","),a(" watch "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"function"),a(),n("span",{class:"token function"},"formatNumber"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"value"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` value `),n("span",{class:"token operator"},"+="),a(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"const"),a(" list "),n("span",{class:"token operator"},"="),a(" value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"split"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'.'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"const"),a(" prefix "),n("span",{class:"token operator"},"="),a(" list"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"charAt"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'-'"),a(),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token string"},"'-'"),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"let"),a(" num "),n("span",{class:"token operator"},"="),a(" prefix "),n("span",{class:"token operator"},"?"),a(" list"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"slice"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},":"),a(" list"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"let"),a(" result "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"while"),a(),n("span",{class:"token punctuation"},"("),a("num"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},">"),a(),n("span",{class:"token number"},"3"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` result `),n("span",{class:"token operator"},"="),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},","),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("num"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"slice"),n("span",{class:"token punctuation"},"("),n("span",{class:"token operator"},"-"),n("span",{class:"token number"},"3"),n("span",{class:"token punctuation"},")"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("result"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),a(` num `),n("span",{class:"token operator"},"="),a(" num"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"slice"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},","),a(" num"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"-"),a(),n("span",{class:"token number"},"3"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("num"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` result `),n("span",{class:"token operator"},"="),a(" num "),n("span",{class:"token operator"},"+"),a(" result"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("prefix"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("result"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("list"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},"]"),a(),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"."),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("list"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"''"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token keyword"},"const"),a(" inputValue "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'111'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"const"),a(" formatValue "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("inputValue"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'-'"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token string"},"'-'"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token function"},"formatNumber"),n("span",{class:"token punctuation"},"("),a("inputValue"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"format"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[a("val"),n("span",{class:"token punctuation"},","),a(" preVal")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token keyword"},"const"),a(" reg "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token regex"},[n("span",{class:"token regex-delimiter"},"/"),n("span",{class:"token regex-source language-regex"},"^-?\\d*(\\.\\d*)?$"),n("span",{class:"token regex-delimiter"},"/")]),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token operator"},"!"),n("span",{class:"token function"},"isNaN"),n("span",{class:"token punctuation"},"("),n("span",{class:"token operator"},"+"),a("val"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"&&"),a(" reg"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"test"),n("span",{class:"token punctuation"},"("),a("val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"||"),a(" val "),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"''"),a(),n("span",{class:"token operator"},"||"),a(" val "),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'-'"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` inputValue`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" val"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"else"),a(),n("span",{class:"token punctuation"},"{"),a(` inputValue`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" preVal"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token comment"},"// '.' at the end or only '-' in the input box."),a(` `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"onBlur"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a(` inputValue`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"charAt"),n("span",{class:"token punctuation"},"("),a("inputValue"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"-"),a(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'.'"),a(),n("span",{class:"token operator"},"||"),a(` inputValue`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'-'"),a(` `),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token function"},"format"),n("span",{class:"token punctuation"},"("),a("inputValue"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"slice"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token operator"},"-"),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(" inputValue"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),a("inputValue"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[a("val"),n("span",{class:"token punctuation"},","),a(" preVal")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token function"},"format"),n("span",{class:"token punctuation"},"("),a("val"),n("span",{class:"token punctuation"},","),a(" preVal"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(` inputValue`),n("span",{class:"token punctuation"},","),a(` onBlur`),n("span",{class:"token punctuation"},","),a(` formatValue`),n("span",{class:"token punctuation"},","),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(` `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(` `),n("span",{class:"token comment"},`/* to prevent the arrow overflow the popup container, or the height is not enough when content is empty */`),a(` `),n("span",{class:"token selector"},".numeric-input .ant-tooltip-inner"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token property"},"min-width"),n("span",{class:"token punctuation"},":"),a(" 32px"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token property"},"min-height"),n("span",{class:"token punctuation"},":"),a(" 37px"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `),n("span",{class:"token selector"},".numeric-input .numeric-input-title"),a(),n("span",{class:"token punctuation"},"{"),a(` `),n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),a(" 14px"),n("span",{class:"token punctuation"},";"),a(` `),n("span",{class:"token punctuation"},"}"),a(` `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),a(` `)])],-1)])),_:1})}var Yn=A(Vn,[["render",Gn]]);const Sn={pageData:{title:"Input",description:"",frontmatter:{category:"Components",type:"\u6570\u636E\u5F55\u5165",title:"Input",subtitle:"\u8F93\u5165\u6846",cover:"https://gw.alipayobjects.com/zos/alicdn/xS9YEJhfe/Input.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:""},{level:2,title:"API",slug:"api",content:"Input"},{level:3,title:"Input",slug:"input",content:""},{level:3,title:"Input \u4E8B\u4EF6",slug:"input-\u4E8B\u4EF6",content:""},{level:3,title:"Input.TextArea",slug:"input-textarea",content:""},{level:3,title:"Input.TextArea \u4E8B\u4EF6",slug:"input-textarea-\u4E8B\u4EF6",content:""},{level:3,title:"Input.Search \u4E8B\u4EF6",slug:"input-search-\u4E8B\u4EF6",content:""}],relativePath:"src/docs/input/index.zh-CN.md",content:` \u901A\u8FC7\u9F20\u6807\u6216\u952E\u76D8\u8F93\u5165\u5185\u5BB9\uFF0C\u662F\u6700\u57FA\u7840\u7684\u8868\u5355\u57DF\u7684\u5305\u88C5\u3002 ## \u4F55\u65F6\u4F7F\u7528 - \u9700\u8981\u7528\u6237\u8F93\u5165\u8868\u5355\u57DF\u5185\u5BB9\u65F6\u3002 - \u63D0\u4F9B\u7EC4\u5408\u578B\u8F93\u5165\u6846\uFF0C\u5E26\u641C\u7D22\u7684\u8F93\u5165\u6846\uFF0C\u8FD8\u53EF\u4EE5\u8FDB\u884C\u5927\u5C0F\u9009\u62E9\u3002 ## API ### Input | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C | | --- | --- | --- | --- | --- | | addonAfter | \u5E26\u6807\u7B7E\u7684 input\uFF0C\u8BBE\u7F6E\u540E\u7F6E\u6807\u7B7E | string\\|slot | | | | addonBefore | \u5E26\u6807\u7B7E\u7684 input\uFF0C\u8BBE\u7F6E\u524D\u7F6E\u6807\u7B7E | string\\|slot | | | | defaultValue | \u8F93\u5165\u6846\u9ED8\u8BA4\u5185\u5BB9 | string | | | | disabled | \u662F\u5426\u7981\u7528\u72B6\u6001\uFF0C\u9ED8\u8BA4\u4E3A false | boolean | false | | | id | \u8F93\u5165\u6846\u7684 id | string | | | | maxlength | \u6700\u5927\u957F\u5EA6 | number | | 1.5.0 | | prefix | \u5E26\u6709\u524D\u7F00\u56FE\u6807\u7684 input | string\\|slot | | | | size | \u63A7\u4EF6\u5927\u5C0F\u3002\u6CE8\uFF1A\u6807\u51C6\u8868\u5355\u5185\u7684\u8F93\u5165\u6846\u5927\u5C0F\u9650\u5236\u4E3A \`large\`\u3002\u53EF\u9009 \`large\` \`default\` \`small\` | string | \`default\` | | | suffix | \u5E26\u6709\u540E\u7F00\u56FE\u6807\u7684 input | string\\|slot | | | | type | \u58F0\u660E input \u7C7B\u578B\uFF0C\u540C\u539F\u751F input \u6807\u7B7E\u7684 type \u5C5E\u6027\uFF0C\u89C1\uFF1A[MDN](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/input#\u5C5E\u6027)(\u8BF7\u76F4\u63A5\u4F7F\u7528 \`Input.TextArea\` \u4EE3\u66FF \`type="textarea"\`)\u3002 | string | \`text\` | | | value(v-model) | \u8F93\u5165\u6846\u5185\u5BB9 | string | | | | allowClear | \u53EF\u4EE5\u70B9\u51FB\u6E05\u9664\u56FE\u6807\u5220\u9664\u5185\u5BB9 | boolean | | | ### Input \u4E8B\u4EF6 | \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E | \u56DE\u8C03\u53C2\u6570 | | ---------- | ---------------------- | ----------- | --- | | change | \u8F93\u5165\u6846\u5185\u5BB9\u53D8\u5316\u65F6\u7684\u56DE\u8C03 | function(e) | | | pressEnter | \u6309\u4E0B\u56DE\u8F66\u7684\u56DE\u8C03 | function(e) | > \u5982\u679C \`Input\` \u5728 \`Form.Item\` \u5185\uFF0C\u5E76\u4E14 \`Form.Item\` \u8BBE\u7F6E\u4E86 \`id\` \u548C \`options\` \u5C5E\u6027\uFF0C\u5219 \`value\` \`defaultValue\` \u548C \`id\` \u5C5E\u6027\u4F1A\u88AB\u81EA\u52A8\u8BBE\u7F6E\u3002 ### Input.TextArea | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C | | --- | --- | --- | --- | --- | --- | | autosize | \u81EA\u9002\u5E94\u5185\u5BB9\u9AD8\u5EA6\uFF0C\u53EF\u8BBE\u7F6E\u4E3A \`true | false\` \u6216\u5BF9\u8C61\uFF1A\`{ minRows: 2, maxRows: 6 }\` | boolean\\|object | false | | | defaultValue | \u8F93\u5165\u6846\u9ED8\u8BA4\u5185\u5BB9 | string | | | | value(v-model) | \u8F93\u5165\u6846\u5185\u5BB9 | string | | | | allowClear | \u53EF\u4EE5\u70B9\u51FB\u6E05\u9664\u56FE\u6807\u5220\u9664\u5185\u5BB9 | boolean | | 1.5.0 | | showCount | \u662F\u5426\u5C55\u793A\u5B57\u6570 | boolean | false | | ### Input.TextArea \u4E8B\u4EF6 | \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E | \u56DE\u8C03\u53C2\u6570 | | ---------- | -------------- | ----------- | | pressEnter | \u6309\u4E0B\u56DE\u8F66\u7684\u56DE\u8C03 | function(e) | \`Input.TextArea\` \u7684\u5176\u4ED6\u5C5E\u6027\u548C\u6D4F\u89C8\u5668\u81EA\u5E26\u7684 [textarea](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea) \u4E00\u81F4\u3002 #### Input.Search | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C | | --- | --- | --- | --- | --- | | enterButton | \u662F\u5426\u6709\u786E\u8BA4\u6309\u94AE\uFF0C\u53EF\u8BBE\u4E3A\u6309\u94AE\u6587\u5B57\u3002\u8BE5\u5C5E\u6027\u4F1A\u4E0E addon \u51B2\u7A81\u3002 | boolean\\|slot | false | | | loading | \u641C\u7D22 loading | boolean | | 1.5.0 | ### Input.Search \u4E8B\u4EF6 | \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E | \u56DE\u8C03\u53C2\u6570 | | -------- | ---------------------------- | ---------------------- | | search | \u70B9\u51FB\u641C\u7D22\u6216\u6309\u4E0B\u56DE\u8F66\u952E\u65F6\u7684\u56DE\u8C03 | function(value, event) | \u5176\u4F59\u5C5E\u6027\u548C Input \u4E00\u81F4\u3002 #### Input.Group | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | | --- | --- | --- | --- | | compact | \u662F\u5426\u7528\u7D27\u51D1\u6A21\u5F0F | boolean | false | | size | \`Input.Group\` \u4E2D\u6240\u6709\u7684 \`Input\` \u7684\u5927\u5C0F\uFF0C\u53EF\u9009 \`large\` \`default\` \`small\` | string | \`default\` | \`\`\`html <a-input-group> <a-input /> <a-input /> </a-input-group> \`\`\` #### Input.Password (1.14.0 \u4E2D\u65B0\u589E) | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | | ---------------- | ---------------- | ------- | ------ | | visibilityToggle | \u662F\u5426\u663E\u793A\u5207\u6362\u6309\u94AE | boolean | true | `,html:`

\u901A\u8FC7\u9F20\u6807\u6216\u952E\u76D8\u8F93\u5165\u5185\u5BB9\uFF0C\u662F\u6700\u57FA\u7840\u7684\u8868\u5355\u57DF\u7684\u5305\u88C5\u3002

\u4F55\u65F6\u4F7F\u7528

\u9700\u8981\u7528\u6237\u8F93\u5165\u8868\u5355\u57DF\u5185\u5BB9\u65F6\u3002
\u63D0\u4F9B\u7EC4\u5408\u578B\u8F93\u5165\u6846\uFF0C\u5E26\u641C\u7D22\u7684\u8F93\u5165\u6846\uFF0C\u8FD8\u53EF\u4EE5\u8FDB\u884C\u5927\u5C0F\u9009\u62E9\u3002

API

Input

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C	\u7248\u672C
addonAfter	\u5E26\u6807\u7B7E\u7684 input\uFF0C\u8BBE\u7F6E\u540E\u7F6E\u6807\u7B7E	string\|slot
addonBefore	\u5E26\u6807\u7B7E\u7684 input\uFF0C\u8BBE\u7F6E\u524D\u7F6E\u6807\u7B7E	string\|slot
defaultValue	\u8F93\u5165\u6846\u9ED8\u8BA4\u5185\u5BB9	string
disabled	\u662F\u5426\u7981\u7528\u72B6\u6001\uFF0C\u9ED8\u8BA4\u4E3A false	boolean	false
id	\u8F93\u5165\u6846\u7684 id	string
maxlength	\u6700\u5927\u957F\u5EA6	number		1.5.0
prefix	\u5E26\u6709\u524D\u7F00\u56FE\u6807\u7684 input	string\|slot
size	\u63A7\u4EF6\u5927\u5C0F\u3002\u6CE8\uFF1A\u6807\u51C6\u8868\u5355\u5185\u7684\u8F93\u5165\u6846\u5927\u5C0F\u9650\u5236\u4E3A `large`\u3002\u53EF\u9009 `large` `default` `small`	string	`default`
suffix	\u5E26\u6709\u540E\u7F00\u56FE\u6807\u7684 input	string\|slot
type	\u58F0\u660E input \u7C7B\u578B\uFF0C\u540C\u539F\u751F input \u6807\u7B7E\u7684 type \u5C5E\u6027\uFF0C\u89C1\uFF1AMDN(\u8BF7\u76F4\u63A5\u4F7F\u7528 `Input.TextArea` \u4EE3\u66FF `type="textarea"`)\u3002	string	`text`
value(v-model)	\u8F93\u5165\u6846\u5185\u5BB9	string
allowClear	\u53EF\u4EE5\u70B9\u51FB\u6E05\u9664\u56FE\u6807\u5220\u9664\u5185\u5BB9	boolean

Input \u4E8B\u4EF6

\u4E8B\u4EF6\u540D\u79F0	\u8BF4\u660E	\u56DE\u8C03\u53C2\u6570
change	\u8F93\u5165\u6846\u5185\u5BB9\u53D8\u5316\u65F6\u7684\u56DE\u8C03	function(e)
pressEnter	\u6309\u4E0B\u56DE\u8F66\u7684\u56DE\u8C03	function(e)

\u5982\u679C Input \u5728 Form.Item \u5185\uFF0C\u5E76\u4E14 Form.Item \u8BBE\u7F6E\u4E86 id \u548C options \u5C5E\u6027\uFF0C\u5219 value defaultValue \u548C id \u5C5E\u6027\u4F1A\u88AB\u81EA\u52A8\u8BBE\u7F6E\u3002

Input.TextArea

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C	\u7248\u672C
autosize	\u81EA\u9002\u5E94\u5185\u5BB9\u9AD8\u5EA6\uFF0C\u53EF\u8BBE\u7F6E\u4E3A `true \| false` \u6216\u5BF9\u8C61\uFF1A`{ minRows: 2, maxRows: 6 }`	boolean\|object	false
defaultValue	\u8F93\u5165\u6846\u9ED8\u8BA4\u5185\u5BB9	string
value(v-model)	\u8F93\u5165\u6846\u5185\u5BB9	string
allowClear	\u53EF\u4EE5\u70B9\u51FB\u6E05\u9664\u56FE\u6807\u5220\u9664\u5185\u5BB9	boolean		1.5.0
showCount	\u662F\u5426\u5C55\u793A\u5B57\u6570	boolean	false

Input.TextArea \u4E8B\u4EF6

\u4E8B\u4EF6\u540D\u79F0	\u8BF4\u660E	\u56DE\u8C03\u53C2\u6570
pressEnter	\u6309\u4E0B\u56DE\u8F66\u7684\u56DE\u8C03	function(e)

Input.TextArea \u7684\u5176\u4ED6\u5C5E\u6027\u548C\u6D4F\u89C8\u5668\u81EA\u5E26\u7684 textarea \u4E00\u81F4\u3002

Input.Search

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C	\u7248\u672C
enterButton	\u662F\u5426\u6709\u786E\u8BA4\u6309\u94AE\uFF0C\u53EF\u8BBE\u4E3A\u6309\u94AE\u6587\u5B57\u3002\u8BE5\u5C5E\u6027\u4F1A\u4E0E addon \u51B2\u7A81\u3002	boolean\|slot	false
loading	\u641C\u7D22 loading	boolean		1.5.0

Input.Search \u4E8B\u4EF6

\u4E8B\u4EF6\u540D\u79F0	\u8BF4\u660E	\u56DE\u8C03\u53C2\u6570
search	\u70B9\u51FB\u641C\u7D22\u6216\u6309\u4E0B\u56DE\u8F66\u952E\u65F6\u7684\u56DE\u8C03	function(value, event)

\u5176\u4F59\u5C5E\u6027\u548C Input \u4E00\u81F4\u3002

Input.Group

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C
compact	\u662F\u5426\u7528\u7D27\u51D1\u6A21\u5F0F	boolean	false
size	`Input.Group` \u4E2D\u6240\u6709\u7684 `Input` \u7684\u5927\u5C0F\uFF0C\u53EF\u9009 `large` `default` `small`	string	`default`

<a-input-group>
  <a-input />
  <a-input />
</a-input-group>

Input.Password (1.14.0 \u4E2D\u65B0\u589E)

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C
visibilityToggle	\u662F\u5426\u663E\u793A\u5207\u6362\u6309\u94AE	boolean	true

`,lastUpdated:1748059052689}},Pn={class:"markdown"};function Xn(s,t,I,d,r,v){return b(),G("article",Pn,t[0]||(t[0]=[Y(`

\u901A\u8FC7\u9F20\u6807\u6216\u952E\u76D8\u8F93\u5165\u5185\u5BB9\uFF0C\u662F\u6700\u57FA\u7840\u7684\u8868\u5355\u57DF\u7684\u5305\u88C5\u3002

\u4F55\u65F6\u4F7F\u7528

\u9700\u8981\u7528\u6237\u8F93\u5165\u8868\u5355\u57DF\u5185\u5BB9\u65F6\u3002
\u63D0\u4F9B\u7EC4\u5408\u578B\u8F93\u5165\u6846\uFF0C\u5E26\u641C\u7D22\u7684\u8F93\u5165\u6846\uFF0C\u8FD8\u53EF\u4EE5\u8FDB\u884C\u5927\u5C0F\u9009\u62E9\u3002

API

Input

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C	\u7248\u672C
addonAfter	\u5E26\u6807\u7B7E\u7684 input\uFF0C\u8BBE\u7F6E\u540E\u7F6E\u6807\u7B7E	string\|slot
addonBefore	\u5E26\u6807\u7B7E\u7684 input\uFF0C\u8BBE\u7F6E\u524D\u7F6E\u6807\u7B7E	string\|slot
defaultValue	\u8F93\u5165\u6846\u9ED8\u8BA4\u5185\u5BB9	string
disabled	\u662F\u5426\u7981\u7528\u72B6\u6001\uFF0C\u9ED8\u8BA4\u4E3A false	boolean	false
id	\u8F93\u5165\u6846\u7684 id	string
maxlength	\u6700\u5927\u957F\u5EA6	number		1.5.0
prefix	\u5E26\u6709\u524D\u7F00\u56FE\u6807\u7684 input	string\|slot
size	\u63A7\u4EF6\u5927\u5C0F\u3002\u6CE8\uFF1A\u6807\u51C6\u8868\u5355\u5185\u7684\u8F93\u5165\u6846\u5927\u5C0F\u9650\u5236\u4E3A `large`\u3002\u53EF\u9009 `large` `default` `small`	string	`default`
suffix	\u5E26\u6709\u540E\u7F00\u56FE\u6807\u7684 input	string\|slot
type	\u58F0\u660E input \u7C7B\u578B\uFF0C\u540C\u539F\u751F input \u6807\u7B7E\u7684 type \u5C5E\u6027\uFF0C\u89C1\uFF1AMDN(\u8BF7\u76F4\u63A5\u4F7F\u7528 `Input.TextArea` \u4EE3\u66FF `type="textarea"`)\u3002	string	`text`
value(v-model)	\u8F93\u5165\u6846\u5185\u5BB9	string
allowClear	\u53EF\u4EE5\u70B9\u51FB\u6E05\u9664\u56FE\u6807\u5220\u9664\u5185\u5BB9	boolean

Input \u4E8B\u4EF6

\u4E8B\u4EF6\u540D\u79F0	\u8BF4\u660E	\u56DE\u8C03\u53C2\u6570
change	\u8F93\u5165\u6846\u5185\u5BB9\u53D8\u5316\u65F6\u7684\u56DE\u8C03	function(e)
pressEnter	\u6309\u4E0B\u56DE\u8F66\u7684\u56DE\u8C03	function(e)

\u5982\u679C Input \u5728 Form.Item \u5185\uFF0C\u5E76\u4E14 Form.Item \u8BBE\u7F6E\u4E86 id \u548C options \u5C5E\u6027\uFF0C\u5219 value defaultValue \u548C id \u5C5E\u6027\u4F1A\u88AB\u81EA\u52A8\u8BBE\u7F6E\u3002

Input.TextArea

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C	\u7248\u672C
autosize	\u81EA\u9002\u5E94\u5185\u5BB9\u9AD8\u5EA6\uFF0C\u53EF\u8BBE\u7F6E\u4E3A `true \| false` \u6216\u5BF9\u8C61\uFF1A`{ minRows: 2, maxRows: 6 }`	boolean\|object	false
defaultValue	\u8F93\u5165\u6846\u9ED8\u8BA4\u5185\u5BB9	string
value(v-model)	\u8F93\u5165\u6846\u5185\u5BB9	string
allowClear	\u53EF\u4EE5\u70B9\u51FB\u6E05\u9664\u56FE\u6807\u5220\u9664\u5185\u5BB9	boolean		1.5.0
showCount	\u662F\u5426\u5C55\u793A\u5B57\u6570	boolean	false

Input.TextArea \u4E8B\u4EF6

\u4E8B\u4EF6\u540D\u79F0	\u8BF4\u660E	\u56DE\u8C03\u53C2\u6570
pressEnter	\u6309\u4E0B\u56DE\u8F66\u7684\u56DE\u8C03	function(e)

Input.TextArea \u7684\u5176\u4ED6\u5C5E\u6027\u548C\u6D4F\u89C8\u5668\u81EA\u5E26\u7684 textarea \u4E00\u81F4\u3002

Input.Search

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C	\u7248\u672C
enterButton	\u662F\u5426\u6709\u786E\u8BA4\u6309\u94AE\uFF0C\u53EF\u8BBE\u4E3A\u6309\u94AE\u6587\u5B57\u3002\u8BE5\u5C5E\u6027\u4F1A\u4E0E addon \u51B2\u7A81\u3002	boolean\|slot	false
loading	\u641C\u7D22 loading	boolean		1.5.0

Input.Search \u4E8B\u4EF6

\u4E8B\u4EF6\u540D\u79F0	\u8BF4\u660E	\u56DE\u8C03\u53C2\u6570
search	\u70B9\u51FB\u641C\u7D22\u6216\u6309\u4E0B\u56DE\u8F66\u952E\u65F6\u7684\u56DE\u8C03	function(value, event)

\u5176\u4F59\u5C5E\u6027\u548C Input \u4E00\u81F4\u3002

Input.Group

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C
compact	\u662F\u5426\u7528\u7D27\u51D1\u6A21\u5F0F	boolean	false
size	`Input.Group` \u4E2D\u6240\u6709\u7684 `Input` \u7684\u5927\u5C0F\uFF0C\u53EF\u9009 `large` `default` `small`	string	`default`

<a-input-group>
  <a-input />
  <a-input />
</a-input-group>

Input.Password (1.14.0 \u4E2D\u65B0\u589E)

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C
visibilityToggle	\u662F\u5426\u663E\u793A\u5207\u6362\u6309\u94AE	boolean	true

`,24)]))}var Fn=A(Sn,[["render",Xn]]);const Nn={pageData:{title:"Input",description:"",frontmatter:{category:"Components",type:"Data Entry",title:"Input",cover:"https://gw.alipayobjects.com/zos/alicdn/xS9YEJhfe/Input.svg"},headers:[{level:2,title:"When To Use",slug:"when-to-use",content:""},{level:2,title:"API",slug:"api",content:"Input"},{level:3,title:"Input",slug:"input",content:""},{level:3,title:"Input Events",slug:"input-events",content:""},{level:3,title:"Input.TextArea",slug:"input-textarea",content:""},{level:3,title:"Input.TextArea Events",slug:"input-textarea-events",content:""},{level:3,title:"Input.Search Events",slug:"input-search-events",content:""}],relativePath:"src/docs/input/index.en-US.md",content:` A basic widget for getting the user input is a text field. Keyboard and mouse can be used for providing or changing data. ## When To Use - A user input in a form field is needed. - A search input is required. ## API ### Input | Property | Description | Type | Default | Version | | --- | --- | --- | --- | --- | | addonAfter | The label text displayed after (on the right side of) the input field. | string\\|slot | | | | addonBefore | The label text displayed before (on the left side of) the input field. | string\\|slot | | | | defaultValue | The initial input content | string | | | | disabled | Whether the input is disabled. | boolean | false | | | id | The ID for input | string | | | | maxlength | max length | number | | 1.5.0 | | prefix | The prefix icon for the Input. | string\\|slot | | | | size | The size of the input box. Note: in the context of a form, the \`large\` size is used. Available: \`large\` \`default\` \`small\` | string | \`default\` | | | suffix | The suffix icon for the Input. | string\\|slot | | | | type | The type of input, see: [MDN](https://developer.mozilla.org/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types)(use \`Input.TextArea\` instead of \`type="textarea"\`) | string | \`text\` | | | value(v-model) | The input content value | string | | | | allowClear | allow to remove input content with clear icon | boolean | | | ### Input Events | Events Name | Description | Arguments | | ----------- | ------------------------------------------------------------------ | ----------- | --- | | change | callback when user input | function(e) | | | pressEnter | The callback function that is triggered when Enter key is pressed. | function(e) | > When \`Input\` is used in a \`Form.Item\` context, if the \`Form.Item\` has the \`id\` and \`options\` props defined then \`value\`, \`defaultValue\`, and \`id\` props of \`Input\` are automatically set. ### Input.TextArea | Property | Description | Type | Default | Version | | --- | --- | --- | --- | --- | --- | | autosize | Height autosize feature, can be set to \`true | false\`or an object\`{ minRows: 2, maxRows: 6 }\` | boolean\\|object | false | | | defaultValue | The initial input content | string | | | | value(v-model) | The input content value | string | | | | allowClear | allow to remove input content with clear icon | boolean | | 1.5.0 | | showCount | Whether show text count | boolean | false | | ### Input.TextArea Events | Events Name | Description | Arguments | | ----------- | ------------------------------------------------------------------ | ----------- | | pressEnter | The callback function that is triggered when Enter key is pressed. | function(e) | The rest of the props of \`Input.TextArea\` are the same as the original [textarea](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea). #### Input.Search | Property | Description | Type | Default | | --- | --- | --- | --- | | enterButton | to show an enter button after input. This prop is conflict with addon. | boolean\\|slot | false | ### Input.Search Events | Events Name | Description | Arguments | Version | | --- | --- | --- | --- | --- | | search | The callback function that is triggered when you click on the search-icon or press Enter key. | function(value, event) | | | loading | Search box with loading. | boolean | | | Supports all props of \`Input\`. #### Input.Group | Property | Description | Type | Default | | --- | --- | --- | --- | | compact | Whether use compact style | boolean | false | | size | The size of \`Input.Group\` specifies the size of the included \`Input\` fields. Available: \`large\` \`default\` \`small\` | string | \`default\` | \`\`\`html <a-input-group> <a-input /> <a-input /> </a-input-group> \`\`\` #### Input.Password (Added in 1.14.0) | Property | Description | Type | Default | | ---------------- | -------------------------- | ------- | ------- | | visibilityToggle | Whether show toggle button | boolean | true | `,html:`

A basic widget for getting the user input is a text field. Keyboard and mouse can be used for providing or changing data.

When To Use

A user input in a form field is needed.
A search input is required.

API

Input

Property	Description	Type	Default	Version
addonAfter	The label text displayed after (on the right side of) the input field.	string\|slot
addonBefore	The label text displayed before (on the left side of) the input field.	string\|slot
defaultValue	The initial input content	string
disabled	Whether the input is disabled.	boolean	false
id	The ID for input	string
maxlength	max length	number		1.5.0
prefix	The prefix icon for the Input.	string\|slot
size	The size of the input box. Note: in the context of a form, the `large` size is used. Available: `large` `default` `small`	string	`default`
suffix	The suffix icon for the Input.	string\|slot
type	The type of input, see: MDN(use `Input.TextArea` instead of `type="textarea"`)	string	`text`
value(v-model)	The input content value	string
allowClear	allow to remove input content with clear icon	boolean

Input Events

Events Name	Description	Arguments
change	callback when user input	function(e)
pressEnter	The callback function that is triggered when Enter key is pressed.	function(e)

When Input is used in a Form.Item context, if the Form.Item has the id and options props defined then value, defaultValue, and id props of Input are automatically set.

Input.TextArea

Property	Description	Type	Default	Version
autosize	Height autosize feature, can be set to `true \| false`or an object`{ minRows: 2, maxRows: 6 }`	boolean\|object	false
defaultValue	The initial input content	string
value(v-model)	The input content value	string
allowClear	allow to remove input content with clear icon	boolean		1.5.0
showCount	Whether show text count	boolean	false

Input.TextArea Events

Events Name	Description	Arguments
pressEnter	The callback function that is triggered when Enter key is pressed.	function(e)

The rest of the props of Input.TextArea are the same as the original textarea.

Input.Search

Property	Description	Type	Default
enterButton	to show an enter button after input. This prop is conflict with addon.	boolean\|slot	false

Input.Search Events

Events Name	Description	Arguments	Version
search	The callback function that is triggered when you click on the search-icon or press Enter key.	function(value, event)
loading	Search box with loading.	boolean

Supports all props of Input.

Input.Group

Property	Description	Type	Default
compact	Whether use compact style	boolean	false
size	The size of `Input.Group` specifies the size of the included `Input` fields. Available: `large` `default` `small`	string	`default`

<a-input-group>
  <a-input />
  <a-input />
</a-input-group>

Input.Password (Added in 1.14.0)

Property	Description	Type	Default
visibilityToggle	Whether show toggle button	boolean	true

`,lastUpdated:1748059052689}},zn={class:"markdown"};function Ln(s,t,I,d,r,v){return b(),G("article",zn,t[0]||(t[0]=[Y(`

A basic widget for getting the user input is a text field. Keyboard and mouse can be used for providing or changing data.

When To Use

A user input in a form field is needed.
A search input is required.

API

Input

Property	Description	Type	Default	Version
addonAfter	The label text displayed after (on the right side of) the input field.	string\|slot
addonBefore	The label text displayed before (on the left side of) the input field.	string\|slot
defaultValue	The initial input content	string
disabled	Whether the input is disabled.	boolean	false
id	The ID for input	string
maxlength	max length	number		1.5.0
prefix	The prefix icon for the Input.	string\|slot
size	The size of the input box. Note: in the context of a form, the `large` size is used. Available: `large` `default` `small`	string	`default`
suffix	The suffix icon for the Input.	string\|slot
type	The type of input, see: MDN(use `Input.TextArea` instead of `type="textarea"`)	string	`text`
value(v-model)	The input content value	string
allowClear	allow to remove input content with clear icon	boolean

Input Events

Events Name	Description	Arguments
change	callback when user input	function(e)
pressEnter	The callback function that is triggered when Enter key is pressed.	function(e)

When Input is used in a Form.Item context, if the Form.Item has the id and options props defined then value, defaultValue, and id props of Input are automatically set.

Input.TextArea

Property	Description	Type	Default	Version
autosize	Height autosize feature, can be set to `true \| false`or an object`{ minRows: 2, maxRows: 6 }`	boolean\|object	false
defaultValue	The initial input content	string
value(v-model)	The input content value	string
allowClear	allow to remove input content with clear icon	boolean		1.5.0
showCount	Whether show text count	boolean	false

Input.TextArea Events

Events Name	Description	Arguments
pressEnter	The callback function that is triggered when Enter key is pressed.	function(e)

The rest of the props of Input.TextArea are the same as the original textarea.

Input.Search

Property	Description	Type	Default
enterButton	to show an enter button after input. This prop is conflict with addon.	boolean\|slot	false

Input.Search Events

Events Name	Description	Arguments	Version
search	The callback function that is triggered when you click on the search-icon or press Enter key.	function(value, event)
loading	Search box with loading.	boolean

Supports all props of Input.

Input.Group

Property	Description	Type	Default
compact	Whether use compact style	boolean	false
size	The size of `Input.Group` specifies the size of the included `Input` fields. Available: `large` `default` `small`	string	`default`

<a-input-group>
  <a-input />
  <a-input />
</a-input-group>

Input.Password (Added in 1.14.0)

Property	Description	Type	Default
visibilityToggle	Whether show toggle button	boolean	true

`,24)]))}var Kn=A(Nn,[["render",Ln]]);const Dn=h({CN:Fn,US:Kn,components:{Basic:D,AutosizeTextarea:R,Presuffix:q,SearchInput:M,SearchInputLoading:nn,Size:on,Group:ln,TextareaResize:rn,Addon:Hn,Tooltip:Yn,AllowClear:In,PasswordInput:vn,ShowCount:hn}});function Jn(s,t,I,d,r,v){const c=p("basic"),k=p("autosize-textarea"),u=p("presuffix"),g=p("search-input"),m=p("search-input-loading"),C=p("size"),w=p("group"),f=p("addon"),H=p("tooltip"),y=p("allow-clear"),l=p("password-input"),V=p("show-count"),B=p("textarea-resize"),Z=p("demo-sort");return b(),W(Z,null,{default:e(()=>[o(c),o(k),o(u),o(g),o(m),o(C),o(w),o(f),o(H),o(y),o(l),o(V),o(B)]),_:1})}var Un=A(Dn,[["render",Jn]]);export{Un as default};