feat(design, form, form-schema, tdesign-vue-next-adapter): textarea支持rows配置

This commit is contained in:
roymondchen 2025-10-24 18:15:26 +08:00
parent ec479b9296
commit 38192a6d48
5 changed files with 41 additions and 5 deletions

View File

@ -8,6 +8,7 @@
@input="inputHandler"
@update:modelValue="updateModelValue"
@blur="blurHandler"
@focus="focusHandler"
>
<template #prepend v-if="$slots.prepend">
<slot name="prepend"></slot>
@ -42,7 +43,7 @@ const uiComponent = ui?.component || 'el-input';
const uiProps = computed<InputProps>(() => ui?.props(props) || props);
const emit = defineEmits(['change', 'input', 'blur', 'update:modelValue']);
const emit = defineEmits(['change', 'input', 'blur', 'focus', 'update:modelValue']);
const instance = ref<any>();
@ -62,6 +63,10 @@ const blurHandler = (...args: any[]) => {
emit('blur', ...args);
};
const focusHandler = (...args: any[]) => {
emit('focus', ...args);
};
defineExpose({
instance,
getInput() {

View File

@ -194,7 +194,6 @@ export interface InputProps {
rows?: number;
type?: string;
size?: FieldSize;
row?: number;
}
export interface InputNumberProps {

View File

@ -373,6 +373,7 @@ export interface TextConfig extends FormItem, Input {
export interface TextareaConfig extends FormItem {
type: 'textarea';
placeholder?: string;
rows?: number;
}
/**

View File

@ -6,6 +6,7 @@
clearable
:placeholder="config.placeholder"
:disabled="disabled"
:rows="config.rows"
@update:model-value="changeHandler"
@input="inputHandler"
>

View File

@ -1,13 +1,17 @@
<template>
<TTextarea
v-if="type === 'textarea'"
ref="textarea"
:modelValue="modelValue"
:size="size === 'default' ? 'medium' : size"
:disabled="disabled"
:placeholder="placeholder"
:row="row"
:rows="rows"
@keypress="inputHandler"
@change="changeHandler"
@blur="blurHandler"
@focus="focusHandler"
@update:modelValue="updateModelValue"
></TTextarea>
<TInputAdornment v-else>
<template #prepend v-if="$slots.prepend">
@ -24,6 +28,8 @@
:placeholder="placeholder"
@keypress="inputHandler"
@change="changeHandler"
@blur="blurHandler"
@focus="focusHandler"
@update:modelValue="updateModelValue"
>
<template #prefix-icon v-if="$slots.prefix">
@ -37,6 +43,7 @@
</template>
<script lang="ts" setup>
import { useTemplateRef, watch } from 'vue';
import { Input as TInput, InputAdornment as TInputAdornment, Textarea as TTextarea } from 'tdesign-vue-next';
import type { InputProps } from '@tmagic/design';
@ -45,13 +52,28 @@ defineOptions({
name: 'TTDesignAdapterInput',
});
defineProps<
const props = defineProps<
InputProps & {
modelValue: string;
}
>();
const emit = defineEmits(['change', 'input', 'update:modelValue']);
const emit = defineEmits(['change', 'input', 'blur', 'focus', 'update:modelValue']);
const textareaRef = useTemplateRef('textarea');
watch(
[textareaRef, () => props.rows],
([val, rows]) => {
if (val && rows) {
const el = val.$el.querySelector('textarea');
if (el) {
el.rows = rows;
}
}
},
{ immediate: true },
);
const changeHandler = (...args: any[]) => {
emit('change', ...args);
@ -61,6 +83,14 @@ const inputHandler = (...args: any[]) => {
emit('input', ...args);
};
const blurHandler = (...args: any[]) => {
emit('blur', ...args);
};
const focusHandler = (...args: any[]) => {
emit('focus', ...args);
};
const updateModelValue = (...args: any[]) => {
emit('update:modelValue', ...args);
};