Input 文本框

文本输入框，扩展内容input组件，是专门为配合表单组件c-form而设计的，内置了边框，图标等，同时包含 input 所有功能

平台

App	小程序	H5
√	√	√

属性

属性名	类型	默认值	说明	平台
modelValue	String,Number	null		All
type	String	text	类型，H5暂未支持动态切换 text，password，number，digit，idcard，tel，safe-password，nickname 注意：为数字时长度不能超过10位	All
toNumber	Boolean	true	输出数字type=number，digit时有效	All
width	Number,String	null	输入框宽度	All
height	Number,String	null	输入框高度 注意此高度是原生input组件的高度，非当前组件的高度 如果原生input组件的min-height大于设置的height，那么height无效	All
placeholder	String	null	水印	All
placeholderColor	String	c-t-input-placeholder	水印颜色 支持c-t-开头的类(字节跳动系列小程序不支持)	All
disabled	Boolean	null	是否禁用	All
disabledBgColor	String	c-bg-base	禁用背景色 支持c-bg-的类	All
readonly	Boolean	null	是否只读 与disabled不同之处在于disabled会置灰组件，而readonly则不会	All
focus	Boolean	false	是否自动获得焦点	All
beforeIcon	String,Object	null	前置图标 为object时参考c-icon的props	All
afterIcon	String,Object	null	后置图标 为object时参考c-icon的props	All
clearBtn	Boolean	true	显示清除按钮	All
clearIcon	String,Object	error-fill	清除图标 参考c-icon的props	All
showPasswordIcon	Boolean	true	type=password时，是否显示小眼睛图标	All
passwordIconProps	Object	{}	密码图标配置 参考c-icon的props	All
align	String	left	文字对齐方式，left/center/right	All
color	String	null	文字颜色，支持c-t-开头的类	All
fontSize	Number,String	null	文字大小	All
border	String	all	边框 all,bottom,none	All
borderColor	String	null	边框颜色 支持c-bdr-开头的类	All
radius	String,Number,Array	c-radius-base	圆角	All
customInputStyle	Object	{}	自定义原生输入框样式	All
maxLength	Number,String	-1	最大输入长度，设置为-1的时候不限制最大长度	All
confirmType	String	done	设置键盘右下角按钮的文字，仅在type="text"时生效。 search,go,send,done,next	All
cursorSpacing	Number	0	指定光标与键盘的距离 取input距离底部的距离和cursor-spacing指定的距离的最小值作为光标与键盘的距离	All
confirmHold	Boolean	false	点击键盘右下角按钮时是否保持键盘不收起	All
selectionStart	Number	-1	光标起始位置，自动聚集时有效，需与selection-end搭配使用	All
selectionEnd	Number	-1	光标结束位置，自动聚集时有效，需与selection-start搭配使用	All
adjustPosition	Boolean	true	键盘弹起时，是否自动上推页面	All
autoBlur	Boolean	false	键盘收起时，是否自动失去焦点	All
textContentType	String		文本区域的语义，可选值oneTimeCode	App-nvue-iOS
alwaysEmbed	Boolean	false	参考uni-app的input组件	MP-WEXIN
holdKeyboard	Boolean	false	参考uni-app的input组件	MP-WEXIN
safePasswordCertPath	String	null	参考uni-app的input组件	MP-WEXIN
safePasswordLength	Number	null	参考uni-app的input组件	MP-WEXIN
safePasswordTimeStamp	Number	null	参考uni-app的input组件	MP-WEXIN
safePasswordNonce	String	null	参考uni-app的input组件	MP-WEXIN
safePasswordSalt	String	null	参考uni-app的input组件	MP-WEXIN
safePasswordCustomHash	String	null	参考uni-app的input组件	MP-WEXIN
randomNumber	Boolean	false	参考uni-app的input组件	MP-ALIPAY
controlled	Boolean	false	参考uni-app的input组件	MP-ALIPAY
alwaysSystem	Boolean	false	参考uni-app的input组件	MP-ALIPAY
cClass	String,Array,Object	null	组件类	All
cStyle	String,Array,Object	null	组件样式	All
margin	String,Number,Array	null	外边距	All
padding	String,Number,Array	null	内边距	All
bgColor	String	null	背景色，支持c-bg-开头的背景色类	All

事件

事件名	说明
update:modelValue
clear
focus
blur
confirm	value
beforeIconClick
afterIconClick
change	value
keyboardheightchange
eye	showPassword

插槽

插槽名	说明
before	前置插槽
default	默认插槽
after	后置插槽

示例

<template>
    <c-input type="text" v-model="myValue" placeholder="请输入内容" />
</template>

文本框SCSS变量

// 输入框颜色
$input-bdr-color: #dcdfe6;
// 输入框占位符颜色
$input-placeholder-color: #999;
// 输入框内边距
$input-padding:0 16rpx;
// 输入框文字大小
$input-fontSize: 28rpx;
// 输入框高度
$input-height: 60rpx;