cv-textarea 多行输入框 ¶
简要 ¶
多行输入框
多行输入框,一般和表单配合使用,默认为实心白色背景。
示例 ¶
vue
<template>
<view class="content">
<view class="components-title">
<view class="components-title-t">cv-textarea</view>
<view class="components-title-d">多行文本输入框</view>
</view>
<cv-form-base ref="refFormBase" :rules="formRules" :model="formData" style="padding: 0 10px">
<cv-form-item label="建议" required>
<cv-textarea v-model="formData.textarea1" placeholder="请输入您的宝贵意见" maxlength="10" />
<template v-slot:tip>请输入您的宝贵意见,我们会认真为您服务</template>
</cv-form-item>
<cv-form-item label="建议" required labelPosition="top">
<cv-textarea v-model="formData.textarea2" placeholder="请输入您的宝贵意见" maxlength="500" />
<template v-slot:tip>请输入您的宝贵意见,我们会认真为您服务</template>
</cv-form-item>
</cv-form-base>
</view>
</template>
<script>
export default {
data() {
return {
formRules: {},
formData: {
textarea1: '',
textarea2: '呵呵呵'
}
};
},
onLoad() {
setTimeout(() => {
this.$testReqMock().then((res) => {
this.formData.textarea1 = '默认值';
});
console.log('模拟请求数据', this.formData);
}, 1000);
},
methods: {
bindTimeChange(e) {},
clickTest(e) {
console.log(this.formData.checkboxtag);
}
}
};
</script>
属性 ¶
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
v-model | String | - | 数据双向绑定 |
placeholder | String | - | 占位符 |
disabled | Boolen | false | 是否禁止 |
maxlength | Number | -1 | 输入长度限制 |
clearable | Boolean | false | 是否显示一键清空按钮 |