代码演示

基本形式

大部分属性的用法与<textarea>一致。

<label>备注:<jr-textarea placeholder="请输入备注" /></label>

表单项

在表单中使用

<jr-form>
<jr-form-item cols="12" title="备注" hint="写点备注吧">
<jr-textarea placeholder="请输入备注" />
</jr-form-item>
</jr-form>

验证

<label>邮箱:<jr-textarea rules={rules} maxlength=20 /></label>
var component = new JRUI.Component({
template: template,
data: {
rules: [
{type: 'isFilled', on: 'blur', message: '请输入邮箱!'},
{type: 'isEmail', on: 'keyup+blur', message: '请输入正确的邮箱!'}
]
}
});

字数实时统计

<label>
最大长度{maxLength}字,已经输入了{(value || '').length}字
<jr-textarea rules={rules} value={value} />
</label>
var component = new JRUI.Component({
template: template,
data: {
maxLength: 10,
value: '',
rules: [
{method: function(text) {
return (text || '').length <= component.data.maxLength;
}, on: 'keyup+blur', message: '字数超出限制!'}
]
}
});

API

Classes

JRTextArea

Constants

Component

JRTextArea 输入扩展

Functions

config()
validate() 根据rules验证组件的值是否正确()object

JRTextArea

Kind: global class
Extend: Component

new JRTextArea()

Param Type Default Description
[options.data] object = 绑定属性
[options.data.value] string <=> 文本框的值
[options.data.placeholder] string => 占位符
[options.data.state] string <=> 文本框的状态
[options.data.maxlength] number => 文本框的最大长度
[options.data.rules] Array.<object> [] => 验证规则
[options.data.autofocus] boolean false => 是否自动获得焦点
[options.data.height] number 120 => 高度
[options.data.required] boolean false => 是否必填
[options.data.message] string "''" => 必填校验失败提示的消息
[options.data.hideTip] boolean false => 是否显示校验错误信息
[options.data.readonly] boolean false => 是否只读
[options.data.disabled] boolean false => 是否禁用
[options.data.visible] boolean true => 是否显示
[options.data.class] string => 补充class
[options.data.size] string => 组件大小, sm/md/lg
[options.data.width] number => 组件宽度

Component


JRTextArea 输入扩展

Kind: global constant

Author: sensen(rainforest92@126.com)

config()

Kind: global function
Access: protected

validate() 根据rules验证组件的值是否正确() ⇒ object

Kind: global function
Returns: object - result 结果
Access: public