@beisen-phoenix/composite-input

@beisen-phoenix/composite-input

Usage no npm install needed!

<script type="module">
  import beisenPhoenixCompositeInput from 'https://cdn.skypack.dev/@beisen-phoenix/composite-input';
</script>

README

复合输入框

@beisen-phoenix/composite-input

概述

可前置或后置元素,一般为标签或按钮

API

参数 说明 类型 默认值 是否必传
showTip 是否超长打点并显示tooltip(仅在禁用,只读时显示tooltip) boolean false
size 输入框尺寸,支持 default large small string default
value 输入框内容 string -
defaultValue 输入框默认内容,若使用了value,则defaultValue无效 string -
placeholder 同原生input string -
status 输入框状态: normal 正常、disabled 禁用、isHint 提示、error 错误 string normal
readOnly 只读状态,不能输入,不显示清除按钮 boolean false
maxLength 最大输入字符,同原生input number -
addonBefore 复合输入框前置元素 string / AddonType -
addonAfter 复合输入框后置元素 string / AddonType -
translation 国际化,详情见下方 object -
onChange 输入框内容变化时的回调 function(value: string) -
onFocus 获取焦点时的回调 function(value: string) -
onBlur 失去焦点时的回调 function(value: string) -
onEnter 按下回车的回调 function(value: string) -
onClick 点击输入框时的回调 function(event) -

数据格式

interface AddonType { options: AddonItemType[]; value: string; onChange: (value: string) => void; }

interface AddonItemType { label: string; value: string; }

translation

translation: {
  placeholder: '请输入'
}