上图若是看不清,可私信给发大图哈
5、小程序UI组件B
表单form
button 按钮
size String default 有效值 default, mini
type String default 按钮的样式类型,有效值 primary, default, warn
plain Boolean false 按钮是否镂空,背景色透明
disabled Boolean false 是否禁用
loading Boolean false 名称前是否带 loading 图标
form-type String 无 有效值:submit, reset,用于 <form/> 组件,点击分别会触发 submit/reset 事件
open-type String 无 有效值:contact,打开客服会话
hover-class String button-hover 指定按钮按下去的样式类。当 hover-class="none" 时,没有点击态效果
hover-start-time Number 20 按住后多久出现点击态,单位毫秒
hover-stay-time Number 70 手指松开后点击态保留时间,单位毫秒
form 表单
report-submit Boolean 是否返回 formId 用于发送模板消息
bindsubmit EventHandle 携带 form 中的数据触发 submit 事件,event.detail = {value : {'name': 'value'} , formId: ''}
bindreset EventHandle 表单重置时会触发 reset 事件
input 输入框
value String 输入框的初始内容
type String "text" input 的类型,有效值:"text", "number", "idcard", "digit"
password Boolean false 是否是密码类型
placeholder String 输入框为空时占位符
placeholder-style String 指定 placeholder 的样式
placeholder-class String "input-placeholder" 指定 placeholder 的样式类
disabled Boolean false 是否禁用
maxlength Number 140 最大输入长度,设置为 -1 的时候不限制最大长度
cursor-spacing Number 0 指定光标与键盘的距离,单位 px 。取 input 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离
auto-focus Boolean false (即将废弃,请直接使用 focus )自动聚焦,拉起键盘
focus Boolean false 获取焦点
confirm-type String "done" 设置键盘右下角按钮的文字,有效值: "send","search","next","go","done"
confirm-hold Boolean false 点击键盘右下角按钮时是否保持键盘不收起
bindinput EventHandle 当键盘输入时,触发input事件,event.detail = {value: value},处理函数可以直接 return 一个字符串,将替换输入框的内容。
bindfocus EventHandle 输入框聚焦时触发,event.detail = {value: value}
bindblur EventHandle 输入框失去焦点时触发,event.detail = {value: value}
bindconfirm EventHandle 点击完成按钮时触发,event.detail = {value: value}
checkbox 多项选择器
bindchange EventHandle <checkbox-group/>中选中项发生改变是触发 change 事件,detail = {value:[选中的checkbox的value的数组]}
radio 单项选择器
radio-group
bindchange EventHandle <radio-group/> 中的选中项发生变化时触发 change 事件,event.detail = {value: 选中项radio的value}
value String <radio/> 标识。当该<radio/> 选中时,<radio-group/> 的 change 事件会携带<radio/>的value
checked Boolean false 当前是否选中
disabled Boolean false 是否禁用
color Color radio的颜色,同css的color
picker 列表选择器
普通选择器:mode = selector
range Array / Object Array [] mode为 selector 时,range 有效
range-key String 当 range 是一个 Object Array 时,通过 range-key 来指定 Object 中 key 的值作为选择器显示内容
value Number 0 value 的值表示表示选择了 range 中的第几个(下标从 0 开始)。
bindchange EventHandle value 改变时触发 change 事件,event.detail = {value: value}
disabled Boolean false 是否禁用
时间选择器:mode = time
value String 表示选中的时间,格式为"hh:mm"
start String 表示有效时间范围的开始,字符串格式为"hh:mm"
end String 表示有效时间范围的结束,字符串格式为"hh:mm"
bindchange EventHandle value 改变时触发 change 事件,event.detail = {value: value}
disabled Boolean false 是否禁用
日期选择器:mode = date
value String 0 表示选中的日期,格式为"YYYY-MM-DD"
start String 表示有效日期范围的开始,字符串格式为"YYYY-MM-DD"
end String 表示有效日期范围的结束,字符串格式为"YYYY-MM-DD"
fields String day 有效值 year,month,day,表示选择器的粒度
bindchange EventHandle value 改变时触发 change 事件,event.detail = {value: value}
disabled Boolean false 是否禁用
picker-view 内嵌列表选择器
value Number Array 数组中的数字依次表示 picker-view 内的 picker-view-colume 选择的第几项(下标从 0 开始),数字大于 picker-view-column 可选项长度时,选择最后一项。
indicator-style String 设置选择器中间选中框的样式
indicator-class String 设置选择器中间选中框的类名
bindchange EventHandle 当滚动选择,value 改变时触发 change 事件,event.detail = {value: value};value为数组,表示 picker-view 内的 picker-view-column 当前选择的是第几项(下标从 0 开始)
slider 滚动选择器
min Number 0 最小值
max Number 100 最大值
step Number 1 步长,取值必须大于 0,并且可被(max - min)整除
disabled Boolean false 是否禁用
value Number 0 当前取值
color Color #e9e9e9 背景条的颜色(请使用 backgroundColor)
selected-color Color #1aad19 已选择的颜色(请使用 activeColor)
activeColor Color #1aad19 已选择的颜色
backgroundColor Color #e9e9e9 背景条的颜色
show-value Boolean false 是否显示当前 value
bindchange EventHandle 完成一次拖动后触发的事件,event.detail = {value: value}
switch 开关选择器
checked Boolean false 是否选中
type String switch 样式,有效值:switch, checkbox
bindchange EventHandle checked 改变时触发 change 事件,event.detail={ value:checked}
color Color switch 的颜色,同 css 的 color
label 标签
for String 绑定控件的 id
textarea 多行输入框
value String 输入框的内容
placeholder String 输入框为空时占位符
placeholder-style String 指定 placeholder 的样式
placeholder-class String textarea-placeholder 指定 placeholder 的样式类
disabled Boolean false 是否禁用
maxlength Number 140 最大输入长度,设置为 -1 的时候不限制最大长度
auto-focus Boolean false 自动聚焦,拉起键盘。
focus Boolean false 获取焦点
auto-height Boolean false 是否自动增高,设置auto-height时,style.height不生效
fixed Boolean false 如果 textarea 是在一个 position:fixed 的区域,需要显示指定属性 fixed 为 true
cursor-spacing Number 0 指定光标与键盘的距离,单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离
bindfocus EventHandle 输入框聚焦时触发,event.detail = {value: value}
bindblur EventHandle 输入框失去焦点时触发,event.detail = {value: value}
bindlinechange EventHandle 输入框行数变化时调用,event.detail = {height: 0, heightRpx: 0, lineCount: 0}
bindinput EventHandle 当键盘输入时,触发 input 事件,event.detail = {value: value}, bindinput 处理函数的返回值并不会反映到 textarea 上
bindconfirm EventHandle 点击完成时, 触发 confirm 事件,event.detail = {value: value}