发现用这个组件,为了给用户更好的体验,要加下属性
1. 通过设置 autosize
属性可以使得文本域的高度能够根据文本内容自动进行调整,并且 autosize
还可以设定为一个对象,指定最小行数和最大行数。:autosize="{ minRows: 3, maxRows: 6}"
2. 输入长度限制 maxlength
3. 是否显示输入字数统计 show-word-limit
1. 显示
2. 写法
<div class="remark"><div class="label item-label" style="line-height: 40px;padding-left: 20px;box-sizing: border-box;width:100%">主要来访嘉宾姓名及职位</div><el-inputtype="textarea"v-model="visitForm.guest":autosize="{ minRows: 3, maxRows: 6}"maxlength="200"class="form-input"placeholder="填写示例:张三-院长,李四-设备科科长;"show-word-limit></el-input>
</div>
3. 提交必填校验
这个注意输入全是空格的情况,因为element-ui输入空格也算1个字符,
// 文本域 判断是否为空
isEmptyOrWhitespace(str) {return !str || str.trim().length === 0;
},
if (this.isEmptyOrWhitespace(visitForm.guest)) {this.handleMessage("主要来访嘉宾姓名及职位必填")return;
}