odboy
882ac772d3
- 将多个组件的props从具体属性名改为统一的value属性 - 为所有组件添加v-model支持，替换原有的具体属性绑定 - 统一实现resetField方法，确保表单重置功能一致性 - 修正组件内部数据绑定逻辑，使用innerValue替代直接修改prop - 更新文档示例，将API参数说明改为value | v-model格式 - 为代码编辑器、富文本编辑器等组件添加input事件发射 - 调整文件上传组件的值类型定义，从Object改为String - 移除废弃的maxLength回调方法，优化编辑器性能 - 重构双向绑定逻辑，确保父子组件数据同步正确性 - 为树形选择器添加ref引用以便操作内部实例 - 调整组件演示页面的导入路径和标签页名称结构
75 lines
1.3 KiB
Vue
75 lines
1.3 KiB
Vue
<!--
|
|
* 多行文本输入组件
|
|
* @author odboy
|
|
* @email tianjun@odboy.cn
|
|
* @created 2026-02-01
|
|
-->
|
|
<template>
|
|
<el-input
|
|
v-model="innerValue"
|
|
type="textarea"
|
|
:autosize="{ minRows: 1, maxRows: 5}"
|
|
placeholder="请输入内容"
|
|
:maxlength="maxlength"
|
|
:disabled="disabled"
|
|
show-word-limit
|
|
:clearable="true"
|
|
resize="vertical"
|
|
autocomplete="false"
|
|
auto-complete="false"
|
|
:readonly="readonly"
|
|
style="width: 100%"
|
|
@input="handleInput"
|
|
/>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'CuteTextAreaInput',
|
|
props: {
|
|
disabled: {
|
|
type: Boolean,
|
|
required: false,
|
|
default: false
|
|
},
|
|
readonly: {
|
|
type: Boolean,
|
|
required: false,
|
|
default: false
|
|
},
|
|
maxlength: {
|
|
type: Number,
|
|
required: false,
|
|
default: 120
|
|
},
|
|
value: {
|
|
type: String,
|
|
required: true,
|
|
default: ''
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
innerValue: ''
|
|
}
|
|
},
|
|
watch: {
|
|
value(newVal) {
|
|
this.innerValue = newVal
|
|
}
|
|
},
|
|
methods: {
|
|
handleInput(value) {
|
|
this.$emit('change', value)
|
|
this.$emit('input', value)
|
|
},
|
|
resetField() {
|
|
this.innerValue = ''
|
|
this.$emit('change', '')
|
|
this.$emit('input', '')
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|