You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
90 lines
1.7 KiB
90 lines
1.7 KiB
<template>
|
|
<el-form-item :label="label" :prop="prop" :rules="rules" :class="[{ 'column': column }]" :required="required">
|
|
<p v-if="desc" class="desc_right">{{ desc }}</p>
|
|
<el-input
|
|
type="textarea"
|
|
v-bind="$attrs"
|
|
v-model="innerValue"
|
|
:style="{ width: width, height: height }"
|
|
:rows="rows"
|
|
@input="handleInput"
|
|
@change="handleChange"
|
|
></el-input>
|
|
</el-form-item>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'MyTextarea',
|
|
inheritAttrs: false,
|
|
props: {
|
|
// v-model 绑定的值
|
|
value: {
|
|
type: [String, Number],
|
|
default: ''
|
|
},
|
|
// 宽度，可以是 '100px' 或 '100%' 等形式
|
|
width: {
|
|
type: String,
|
|
default: '100%'
|
|
},
|
|
desc: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// 高度，可以是 '100px' 或 '100%' 等形式
|
|
height: {
|
|
type: String,
|
|
default: 'auto'
|
|
},
|
|
// 默认行数
|
|
rows: {
|
|
type: Number,
|
|
default: 4
|
|
},
|
|
// 表单标签
|
|
label: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
column: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// 表单校验的 prop
|
|
prop: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// 表单校验规则
|
|
rules: {
|
|
type: [Object, Array],
|
|
default: () => []
|
|
},
|
|
required:{
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
innerValue: this.value
|
|
}
|
|
},
|
|
watch: {
|
|
value(newVal) {
|
|
if (newVal !== this.innerValue) {
|
|
this.innerValue = newVal
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
handleInput(value) {
|
|
this.$emit('input', value)
|
|
},
|
|
handleChange(value) {
|
|
this.$emit('change', value)
|
|
}
|
|
}
|
|
}
|
|
</script>
|