diff --git a/packages/opendesign/src/_components/in-input/InInput.vue b/packages/opendesign/src/_components/in-input/InInput.vue
index 3362b6c2c1e7808d5047cd829207619c7e774f82..43a2b146f83443bc71c1be90ab9a349da2d56065 100644
--- a/packages/opendesign/src/_components/in-input/InInput.vue
+++ b/packages/opendesign/src/_components/in-input/InInput.vue
@@ -1,35 +1,29 @@
 <script setup lang="ts">
-import { computed, ref, watch, toRefs, watchEffect } from 'vue';
+import { computed, ref, toRefs, watchEffect } from 'vue';
 import { inInputProps } from './types';
 import { IconClose, IconEyeOn, IconEyeOff } from '../../_utils/icons';
-import { formateToString } from '../../_utils/helper';
-import { useInput } from '../../_headless/use-input';
+import { useInput, type UseInputEmitsT } from '../../_headless/use-input';
 import { useInputPassword } from '../../_headless/use-input-password';
 import { slotNames } from './slot';
-import { isFunction } from '../../_utils/is';
 import { useI18n } from '../../locale';
 
 const props = defineProps(inInputProps);
 
-const emits = defineEmits<{
+type InInputEmitsT = {
   (e: 'update:modelValue', value: string): void;
-  (e: 'change', value: string): void;
-  (e: 'input', evt: Event): void;
-  (e: 'blur', evt: FocusEvent): void;
-  (e: 'focus', evt: FocusEvent): void;
-  (e: 'clear', evt?: Event): void;
-  (e: 'pressEnter', evt: KeyboardEvent): void;
-}>();
+} & UseInputEmitsT;
+
+const emits = defineEmits<InInputEmitsT>();
 const { t } = useI18n();
 
-const { disabled, type, format, validate } = toRefs(props);
+const { disabled, type, modelValue, inputOnOutlimit, maxLength, minLength } = toRefs(props);
 
 const {
-  realValue,
   displayValue,
-  updateValue,
   clearValue: clear,
   isValid,
+  inputValueLength,
+  isOutLengthLimit,
   handleBlur,
   handleInput,
   handleFocus,
@@ -38,14 +32,18 @@ const {
   inputEl,
 } = useInput({
   emits,
-  defaultValue: props.modelValue ?? props.defaultValue ?? '',
+  maxLength,
+  minLength,
+  inputOnOutlimit,
+  modelValue,
+  defaultValue: props.defaultValue ?? '',
   emitUpdate: (value: string) => {
     emits('update:modelValue', value);
   },
-  format,
-  validate,
+  format: props.format,
+  validate: props.validate,
   onInvalidChange: props.onInvalidChange,
-  beforeInput: props.beforeInput,
+  calculateLength: props.getLength,
 });
 
 const { showPassword, onEyeMouseDown, onEyeMouseUp, onEyeClick } = useInputPassword({
@@ -65,17 +63,6 @@ watchEffect(() => {
   togglePassword(showPassword.value);
 });
 
-// 监听属性变化，刷新值
-watch(
-  () => props.modelValue,
-  (val) => {
-    const value = formateToString(val);
-    if (value !== realValue.value) {
-      updateValue(value);
-    }
-  }
-);
-
 // 是否可清除
 const isClearable = computed(() => props.clearable && !props.disabled && !props.readonly);
 
@@ -83,31 +70,13 @@ const focus = () => {
   inputEl.value?.focus();
 };
 
-// 计算当前长度
-const currentLength = computed(() => {
-  if (isFunction(props.getLength)) {
-    return props.getLength(realValue.value);
-  }
-  return realValue.value.length ?? 0;
-});
-// 是否超出最大长度限制
-const isOutLengthLimit = computed(() => {
-  if (props.maxLength !== undefined && currentLength.value > props.maxLength) {
-    return true;
-  }
-  if (props.minLength !== undefined && currentLength.value < props.minLength) {
-    return true;
-  }
-  return false;
-});
-
 /**
  * 自适应宽度
  */
 const autoWidth = computed(() => props.autoWidth);
 const mirrorValue = computed(() => {
   if (props.type === 'password') {
-    return displayValue.value.replace(/./g, '\u2022');
+    return displayValue.value.replace(/./g, props.passwordPlaceholder);
   }
   return displayValue.value;
 });
@@ -140,12 +109,11 @@ defineExpose({
         :id="props.inputId"
         ref="inputEl"
         class="o_input-input"
+        :value="displayValue"
         :type="inputType"
         :placeholder="props.placeholder"
         :readonly="props.readonly"
         :disabled="props.disabled"
-        :maxlength="props.inputOnOutlimit ? '' : props.maxLength"
-        :minlength="props.inputOnOutlimit ? '' : props.minLength"
         @focus="handleFocus"
         @blur="handleBlur"
         @input="handleInput"
@@ -181,7 +149,7 @@ defineExpose({
         v-if="props.maxLength"
         class="o_input-limit"
         :class="{ 'o_input-limit-error': isOutLengthLimit }"
-        v-html="t('input.limit', currentLength, props.maxLength)"
+        v-html="t('input.limit', inputValueLength, props.maxLength)"
       ></div>
       <span v-if="$slots.extra">
         <slot :name="slotNames.extra"></slot>
diff --git a/packages/opendesign/src/_components/in-input/__demo__/TheIndex.vue b/packages/opendesign/src/_components/in-input/__demo__/TheIndex.vue
index 5f065181fc6d113647fcfa92b4abf383e9eb2229..8bffedb44d6f0d85a3298dd59adf0ca4e3d97383 100644
--- a/packages/opendesign/src/_components/in-input/__demo__/TheIndex.vue
+++ b/packages/opendesign/src/_components/in-input/__demo__/TheIndex.vue
@@ -1,16 +1,20 @@
 <script setup lang="ts">
 import '../style';
 import InInput from '../InInput.vue';
-import { ref, watchEffect } from 'vue';
-const inputVal = ref('123');
+import { ref } from 'vue';
+const inputVal = ref('124567890');
 
 const printEvent = (evt: string, v?: string) => {
-  console.log(`[${evt}]`, v ?? '', 'value:', inputVal.value);
+  console.log(`[${evt}]`, v ?? '', 'inputVal:', inputVal.value);
 };
 
 const disabled = ref(false);
-const toggleDisabled = () => {
+const maxLength = ref(6);
+const minLength = ref(4);
+const toggle = () => {
   disabled.value = !disabled.value;
+  maxLength.value = 5;
+  minLength.value = 2;
 };
 
 const type = ref<'text' | 'password'>('text');
@@ -19,7 +23,25 @@ const toggleType = () => {
 };
 
 const validate = (value: string): boolean => {
-  return Boolean(value.length % 2);
+  return !(value.length % 2);
+};
+
+const onUpdate = (val: string) => {
+  inputVal.value = val;
+};
+
+const format = (val: string) => {
+  return `￥${val.replace(/\B(?=(\d{1})+(?!\d))/g, ',')}`;
+};
+
+const onInvalidChange = (currentValue: string, lastValid: string) => {
+  console.log('onInvalidChange:', currentValue, lastValid);
+  return lastValid;
+};
+
+const onChange = (currentValue: string, lastValue: string) => {
+  console.log('change:', currentValue, lastValue);
+  inputVal.value = currentValue;
 };
 </script>
 
@@ -27,13 +49,35 @@ const validate = (value: string): boolean => {
   <div class="page-demo">
     <h3>Basic</h3>
     <div>value: {{ inputVal }}</div>
-    <button @click="toggleDisabled">change disabled</button>
+    <button @click="toggle">change</button>
     <button @click="toggleType">change type</button>
     <section>
+      defaultValue: {{ inputVal }}; format
       <InInput
         input-id="123"
         class="test-input"
-        v-model="inputVal"
+        :default-value="inputVal"
+        :validate="validate"
+        @clear="() => printEvent('clear')"
+        @blur="() => printEvent('blur')"
+        @change="onChange"
+        @input="(e, value) => printEvent('input', value)"
+        @focus="() => printEvent('focus')"
+        @press-enter="() => printEvent('press-enter')"
+        clearable
+        :max-length="maxLength"
+        :format="format"
+        :onInvalidChange="onInvalidChange"
+        :input-on-outlimit="false"
+      />
+    </section>
+    <section>
+      max: {{ maxLength }}; min: {{ minLength }} input-on-outlimit: false
+      <InInput
+        input-id="1234"
+        class="test-input"
+        :model-value="inputVal"
+        @update:model-value="onUpdate"
         :validate="validate"
         @clear="() => printEvent('clear')"
         @blur="() => printEvent('blur')"
@@ -42,13 +86,13 @@ const validate = (value: string): boolean => {
         @focus="() => printEvent('focus')"
         @press-enter="() => printEvent('press-enter')"
         clearable
-        :max-length="8"
-        :min-length="4"
+        :max-length="maxLength"
+        :min-length="minLength"
         :input-on-outlimit="false"
       />
     </section>
     <section>
-      auto width:
+      auto width; max: 8;
       <InInput class="test-input" :type="type" v-model="inputVal" auto-width :max-length="8" clearable />
     </section>
     <section>
diff --git a/packages/opendesign/src/_components/in-input/types.ts b/packages/opendesign/src/_components/in-input/types.ts
index f04cd651a1ae832e8aaf0389fcf7982249c681a9..f4068687b5a9afcb8bfdd155988909dbf103d6d9 100644
--- a/packages/opendesign/src/_components/in-input/types.ts
+++ b/packages/opendesign/src/_components/in-input/types.ts
@@ -3,7 +3,7 @@ import { ExtractPropTypes, PropType } from 'vue';
 export const inInputProps = {
   /**
    * 下拉框的值
-   * v-model
+   * v-model 受控
    */
   modelValue: {
     type: String,
@@ -90,10 +90,10 @@ export const inInputProps = {
     type: Function as PropType<(value: string) => boolean>,
   },
   /**
-   * 输入为无效值时，在blur时的回调，返回值为纠正后的值
+   * 输入为无效值时，在blur/pressEnter时的回调，返回值为纠正后的值
    */
   onInvalidChange: {
-    type: Function as PropType<(inputValue: string, lastValidInputValue: string, lastValue: string) => string>,
+    type: Function as PropType<(inputValue: string, lastValidInputValue: string) => string>,
   },
   /**
    * 显示密码的方式
@@ -109,10 +109,11 @@ export const inInputProps = {
     type: Boolean,
   },
   /**
-   * 针对输入内容进行处理，返回值作为输入最终值
+   * 密码单个字符占位符
    */
-  beforeInput: {
-    type: Function as PropType<(value: string) => string>,
+  passwordPlaceholder: {
+    type: String,
+    default: '\u2022',
   },
 };
 
diff --git a/packages/opendesign/src/_components/in-textarea/InTextarea.vue b/packages/opendesign/src/_components/in-textarea/InTextarea.vue
index a0ccfedd009d60bbdec062058d1f97e241f9fa0d..c41afd71b69adc54969038ac0c5d97154527138e 100644
--- a/packages/opendesign/src/_components/in-textarea/InTextarea.vue
+++ b/packages/opendesign/src/_components/in-textarea/InTextarea.vue
@@ -1,10 +1,8 @@
 <script setup lang="ts">
-import { computed, watch, toRefs } from 'vue';
+import { computed, toRefs } from 'vue';
 import { inTextareaProps } from './types';
 import { IconClose } from '../../_utils/icons';
-import { formateToString } from '../../_utils/helper';
 import { useInput } from '../../_headless/use-input';
-import { isFunction } from '../../_utils/is';
 import { slotNames } from './slot';
 import { useI18n } from '../../locale';
 import { vScrollbar } from '../../scrollbar';
@@ -23,30 +21,32 @@ const emits = defineEmits<{
 
 const { t } = useI18n();
 
-const { format, validate } = toRefs(props);
+const { modelValue, inputOnOutlimit, maxLength, minLength } = toRefs(props);
 
 const {
-  realValue,
   displayValue,
-  updateValue,
   clearValue: clear,
   isValid,
+  inputValueLength,
+  isOutLengthLimit,
   handleBlur,
   handleInput,
   handleFocus,
-  handlePressEnter,
   handleClear,
   inputEl,
 } = useInput({
   emits,
-  defaultValue: props.modelValue ?? props.defaultValue ?? '',
+  maxLength,
+  minLength,
+  inputOnOutlimit,
+  modelValue,
+  defaultValue: props.defaultValue ?? '',
   emitUpdate: (value: string) => {
     emits('update:modelValue', value);
   },
-  format,
-  validate,
+  format: props.format,
+  validate: props.validate,
   onInvalidChange: props.onInvalidChange,
-  beforeInput: props.beforeInput,
 });
 
 const resizeValue = computed(() => {
@@ -62,17 +62,6 @@ const resizeValue = computed(() => {
   }
 });
 
-// 监听属性变化，刷新值
-watch(
-  () => props.modelValue,
-  (val) => {
-    const value = formateToString(val);
-    if (value !== realValue.value) {
-      updateValue(value);
-    }
-  }
-);
-
 // 是否可清除
 const isClearable = computed(() => props.clearable && !props.disabled && !props.readonly);
 
@@ -80,23 +69,6 @@ const focus = () => {
   inputEl.value?.focus();
 };
 
-// 计算当前长度
-const currentLength = computed(() => {
-  if (isFunction(props.getLength)) {
-    return props.getLength(realValue.value);
-  }
-  return realValue.value.length ?? 0;
-});
-// 是否超出最大长度限制
-const isOutLengthLimit = computed(() => {
-  if (props.maxLength !== undefined && currentLength.value > props.maxLength) {
-    return true;
-  }
-  if (props.minLength !== undefined && currentLength.value < props.minLength) {
-    return true;
-  }
-  return false;
-});
 /**
  * 自适应高度
  */
@@ -145,12 +117,11 @@ defineExpose({
       <textarea
         :id="props.textareaId"
         ref="inputEl"
+        :value="displayValue"
         class="o_textarea-textarea"
         :placeholder="props.placeholder"
         :readonly="props.readonly"
         :disabled="props.disabled"
-        :maxlength="props.inputOnOutlimit ? '' : props.maxLength"
-        :minLength="props.inputOnOutlimit ? '' : props.minLength"
         :rows="props.rows"
         :cols="props.cols"
         :style="{
@@ -160,7 +131,6 @@ defineExpose({
         @focus="handleFocus"
         @blur="handleBlur"
         @input="handleInput"
-        @keydown="handlePressEnter"
       ></textarea>
       <div v-if="isClearable" class="o_textarea-suffix o_textarea-clear" @click="handleClear">
         <IconClose class="o_textarea-clear-icon" />
@@ -169,7 +139,7 @@ defineExpose({
         v-if="props.maxLength"
         class="o_textarea-suffix o_textarea-count"
         :class="{ 'o_textarea-count-error': isOutLengthLimit }"
-        v-html="t('input.limit', currentLength, props.maxLength)"
+        v-html="t('input.limit', inputValueLength, props.maxLength)"
       ></div>
     </div>
 
diff --git a/packages/opendesign/src/_components/in-textarea/__demo__/TheIndex.vue b/packages/opendesign/src/_components/in-textarea/__demo__/TheIndex.vue
index 97e6e1d409a6086a34c6564f34de037a14d6de78..d26288649fd54fca43d3fccc84b749989fd2f282 100644
--- a/packages/opendesign/src/_components/in-textarea/__demo__/TheIndex.vue
+++ b/packages/opendesign/src/_components/in-textarea/__demo__/TheIndex.vue
@@ -2,15 +2,18 @@
 import '../style';
 import { InTextarea } from '../index';
 import { ref } from 'vue';
-const inputVal = ref('123');
+
+const inputVal = ref('1234');
 
 const printEvent = (evt: string, v?: string) => {
   console.log(`[${evt}]`, v ?? '', 'value:', inputVal.value);
 };
 
-const disabled = ref(false);
-const toggleDisabled = () => {
-  disabled.value = !disabled.value;
+const maxLength = ref(20);
+const minLength = ref(10);
+const toggle = () => {
+  maxLength.value = 10;
+  minLength.value = 4;
 };
 
 const type = ref<'text' | 'password'>('text');
@@ -24,15 +27,35 @@ const validate = (value: string): boolean => {
 const click = () => {
   alert(123);
 };
+
+const onChange = (v: string) => {
+  inputVal.value = v;
+};
 </script>
 
 <template>
   <div class="page-demo">
     <h3>Basic</h3>
     <div>value: {{ inputVal }}</div>
-    <button @click="toggleDisabled">change disabled</button>
+    <button @click="toggle">change</button>
     <button @click="toggleType">change type</button>
-    <section>
+    <div class="block">
+      <p>defaultValue: 你好</p>
+      <InTextarea
+        class="test-input"
+        default-value="你好"
+        @clear="() => printEvent('clear')"
+        @blur="() => printEvent('blur')"
+        @change="onChange"
+        @input="() => printEvent('input')"
+        @focus="() => printEvent('focus')"
+        @press-enter="() => printEvent('press-enter')"
+        clearable
+        resize="both"
+      />
+    </div>
+    <div class="block">
+      <p>max: {{ maxLength }}; min: {{ minLength }} input-on-outlimit: false</p>
       <InTextarea
         class="test-input"
         v-model="inputVal"
@@ -44,15 +67,16 @@ const click = () => {
         @focus="() => printEvent('focus')"
         @press-enter="() => printEvent('press-enter')"
         clearable
-        :max-length="20"
-        :min-length="10"
+        :max-length="maxLength"
+        :min-length="minLength"
+        :input-on-outlimit="false"
         resize="both"
       >
         <template #suffix>
           <button @click="click">123</button>
         </template>
       </InTextarea>
-    </section>
+    </div>
     <section block>
       <p>auto width:</p>
       <InTextarea class="test-input" :type="type" v-model="inputVal" auto-size clearable>
diff --git a/packages/opendesign/src/_components/in-textarea/style/index.scss b/packages/opendesign/src/_components/in-textarea/style/index.scss
index 21eec7fd8fa213b2bd8339d85a77273688803773..4edf2339ec79d583701a1d9bfaa0da4da7f479df 100644
--- a/packages/opendesign/src/_components/in-textarea/style/index.scss
+++ b/packages/opendesign/src/_components/in-textarea/style/index.scss
@@ -3,6 +3,7 @@
 .o_textarea {
   color: inherit;
   max-width: 100%;
+  max-height: inherit;
   min-width: inherit;
   min-height: inherit;
   cursor: inherit;
@@ -53,7 +54,7 @@
 }
 
 .o_textarea-clear {
-  right: 8px;
+  right: 2px;
   top: 50%;
   font-size: var(--icon-size);
   margin-top: calc(var(--icon-size) / -2);
diff --git a/packages/opendesign/src/_components/in-textarea/types.ts b/packages/opendesign/src/_components/in-textarea/types.ts
index 1c2f7012f6371910826eea18f88a66c7f4d1d55f..aac0d3d29363ba1e2b43cb7621a31215650a90ad 100644
--- a/packages/opendesign/src/_components/in-textarea/types.ts
+++ b/packages/opendesign/src/_components/in-textarea/types.ts
@@ -59,7 +59,7 @@ export const inTextareaProps = {
    * 输入为无效值时，在blur
    */
   onInvalidChange: {
-    type: Function as PropType<(inputValue: string, lastValidInputValue: string, lastValue: string) => string>,
+    type: Function as PropType<(inputValue: string, lastValidInputValue: string) => string>,
   },
   /**
    * 显示的行数
@@ -126,12 +126,6 @@ export const inTextareaProps = {
     type: [Boolean, Object] as PropType<boolean | Partial<BaseScrollerPropsT>>,
     default: true,
   },
-  /**
-   * 针对输入内容进行处理，返回值作为输入最终值
-   */
-  beforeInput: {
-    type: Function as PropType<(value: string) => string>,
-  },
 };
 
 export type inTextareaProps = ExtractPropTypes<typeof inTextareaProps>;
diff --git a/packages/opendesign/src/_headless/use-input.ts b/packages/opendesign/src/_headless/use-input.ts
index 39347ba2d66bde26e9cd08008e8c191ae1d25084..c339fe25be15b7a147348c067bdcb1dfaec05865 100644
--- a/packages/opendesign/src/_headless/use-input.ts
+++ b/packages/opendesign/src/_headless/use-input.ts
@@ -1,129 +1,217 @@
 /* eslint-disable max-lines-per-function */
 import { useComposition } from '../hooks/use-composition';
-import { isFunction } from '../_utils/is';
+import { isFunction, isNumber, isUndefined } from '../_utils/is';
 import { Enter } from '../_utils/keycode';
-import { ref, computed, Ref, watchEffect } from 'vue';
-
-type EmitsT = {
-  (e: 'change', value: string): void;
-  (e: 'input', evt: Event): void;
-  (e: 'blur', evt: FocusEvent): void;
+import { ref, computed, Ref, watch, nextTick } from 'vue';
+
+export type UseInputEmitsT = {
+  // 仅在输入框失焦或按下回车时触发
+  (e: 'change', value: string, lastValue: string): void;
+  // 用户输入时触发
+  (e: 'input', evt: Event, value: string): void;
+  // 输入框获取焦点时触发
   (e: 'focus', evt: FocusEvent): void;
+  // 输入框失去焦点时触发
+  (e: 'blur', evt: FocusEvent): void;
+  // 用户点击清除按钮时触发
   (e: 'clear', evt?: Event): void;
+  // 用户按下回车时触发
   (e: 'pressEnter', evt: KeyboardEvent): void;
 };
 export interface InputOptionT {
-  defaultValue: string;
-  emits: EmitsT;
+  modelValue?: Ref<string | undefined>;
+  defaultValue?: string;
+  emits: UseInputEmitsT;
   emitUpdate: (value: string) => void;
-  validate?: Ref<((value: string) => boolean) | undefined>;
-  onInvalidChange?: (inputValue: string, lastValidInputValue: string, lastValue: string) => string;
-  format?: Ref<((value: string) => string) | undefined>;
-  beforeInput?: (inputValue: string) => string;
+  validate?: (value: string) => boolean;
+  onInvalidChange?: (inputValue: string, lastValidInputValue: string) => string;
+  format?: (value: string) => string;
+  maxLength?: Ref<number | undefined>;
+  minLength?: Ref<number | undefined>;
+  calculateLength?: (value: string) => number;
+  inputOnOutlimit?: Ref<boolean | undefined>;
 }
 
 /**
  * 输入框
  */
 export function useInput(options: InputOptionT) {
-  const { defaultValue, format, emits, emitUpdate, validate, onInvalidChange, beforeInput } = options;
-  const currentValue = ref(defaultValue);
-  const lastValue = ref(defaultValue);
+  const { modelValue, defaultValue, format, emits, emitUpdate, validate, onInvalidChange, maxLength, minLength, calculateLength, inputOnOutlimit } = options;
+
+  const formatFn = (v: string) => {
+    return isFunction(format) ? format(v) : v;
+  };
+  const calculateStringLength = (v: string) => {
+    return isFunction(calculateLength) ? calculateLength(v) : v.length;
+  };
+
+  const uncontroledValue = ref(defaultValue);
+  const controledValue = modelValue;
+
+  // 当前值
+  const computedValue = computed(() => {
+    const cv = controledValue?.value;
+    const ucv = uncontroledValue.value ?? '';
+
+    return cv ?? ucv;
+  });
+
+  // 输入框显示值
+  const displayValue = ref(formatFn(computedValue.value));
+
+  // 计算值当前长度
+  const inputValueLength = computed(() => {
+    return calculateStringLength(computedValue.value);
+  });
+
+  const validateMaxLength = (length: number) => {
+    if (!isNumber(maxLength?.value)) {
+      return true;
+    }
+    return length <= maxLength.value;
+  };
+  const validateMinLength = (length: number) => {
+    if (!isNumber(minLength?.value)) {
+      return true;
+    }
+    return length >= minLength.value;
+  };
+  // 内部校验长度函数
+  const validateLengthFn = (value: string) => {
+    const len = calculateStringLength(value);
 
-  const formatFn = computed(() => (isFunction(format?.value) ? format.value : (v: string) => v));
-  const validateFn = computed(() => (isFunction(validate?.value) ? validate.value : () => true));
+    return validateMaxLength(len) && validateMinLength(len);
+  };
+
+  // 是否满足长度要求
+  const isOutLengthLimit = computed(() => {
+    return !validateLengthFn(computedValue.value);
+  });
 
-  const displayValue = ref(formatFn.value(currentValue.value));
+  // 内部校验函数+用户传入的校验函数
+  const mergedValidateFn = (v: string) => {
+    const r = validateLengthFn(v);
+    if (r && isFunction(validate)) {
+      return validate(v);
+    }
+    return r;
+  };
 
   const inputEl = ref<HTMLInputElement>();
+
+  // 正在输入中文，处理输入过程中触发input事件
+  const composition = useComposition({ el: inputEl });
+
   // 聚焦状态
   const isFocus = ref(false);
 
   // 值可用状态
   const isValid = ref(true);
 
-  // 记录上一次有效输入值
-  let lastValidValue: string = '';
-
-  const setNativeDisplayValue = (value: string) => {
-    if (inputEl.value) {
-      inputEl.value.value = value;
-      displayValue.value = value;
-    }
-  };
-
-  /**
+  /**`
    * 校验是否值有效，如果值为空，始终有效
    */
-  const doValidate = () => {
-    isValid.value = currentValue.value === '' ? true : validateFn.value(currentValue.value);
+  const validateValue = (value: string) => {
+    isValid.value = value === '' ? true : mergedValidateFn(value);
     return isValid.value;
   };
-  // 初始可用状态
-  if (doValidate()) {
-    lastValidValue = currentValue.value;
-  }
 
-  watchEffect(() => {
-    if (doValidate()) {
-      lastValidValue = currentValue.value;
+  // 在长度限制变化时，重新校验
+  watch(
+    () => [maxLength?.value, minLength?.value],
+    () => {
+      validateValue(computedValue.value);
     }
+  );
 
-    if (!(format?.value && isFocus.value)) {
-      setNativeDisplayValue(formatFn.value(currentValue.value));
+  // 记录上一次有效输入值
+  let lastValidValue: string = validateValue(computedValue.value) ? computedValue.value : '';
+  let lastValue: string = computedValue.value;
+
+  watch(
+    () => computedValue.value,
+    (val) => {
+      if (!isUndefined(val) && validateValue(val)) {
+        lastValidValue = val;
+      }
+      if (isFocus.value) {
+        displayValue.value = val;
+      } else {
+        displayValue.value = formatFn(val);
+      }
     }
-  });
+  );
 
-  // 正在输入中文，处理输入过程中触发input事件
-  const composition = useComposition({ el: inputEl });
+  const updateValue = (value: string) => {
+    uncontroledValue.value = value;
 
-  const emitUpdateValue = () => {
-    emitUpdate(currentValue.value);
+    emitUpdate(value);
   };
 
-  const emitValidUpdateValue = () => {
+  const getValidValue = () => {
+    let validVal = computedValue.value;
     // 值有效性校验
-    if (!doValidate()) {
+    if (!isValid.value) {
       if (isFunction(onInvalidChange)) {
-        currentValue.value = onInvalidChange(currentValue.value, lastValidValue, lastValue.value);
-        doValidate();
+        // 这调用onInvalidChange回调获取对应回调值
+        validVal = onInvalidChange(computedValue.value, lastValidValue);
+        validateValue(validVal);
       } else {
-        currentValue.value = lastValidValue;
+        // 回退到上一次有效值
+        validVal = lastValidValue;
         isValid.value = true;
       }
-      emitUpdateValue();
-    } else {
-      lastValidValue = currentValue.value;
     }
+
+    return validVal;
   };
 
-  const emitChange = () => {
-    if (currentValue.value !== lastValue.value) {
-      emits('change', currentValue.value);
-      lastValue.value = currentValue.value;
+  const emitChange = (value: string) => {
+    if (value !== lastValue) {
+      emits('change', computedValue.value, lastValue);
+      lastValue = computedValue.value;
     }
   };
 
+  // 控制输入框显示值
+  const keepNativeDisplayValue = () => {
+    if (inputEl.value && inputEl.value.value !== displayValue.value) {
+      inputEl.value.value = displayValue.value;
+    }
+  };
+
+  const isAllowedToInput = (value: string) => {
+    if (inputOnOutlimit?.value) {
+      return true;
+    }
+    const len = calculateStringLength(value);
+    const isLower = validateMaxLength(len);
+    if (isLower) {
+      return true;
+    }
+    // 超出长度限制，且为字符长度减少，则支持操作
+    if (len < calculateStringLength(computedValue.value)) {
+      return true;
+    }
+    return false;
+  };
+
   const handleInput = (e: Event) => {
     if (composition.isComposing.value) {
       return;
     }
 
-    let val = (e.target as HTMLInputElement)?.value;
+    const value = (e.target as HTMLInputElement)?.value;
 
-    if (isFunction(beforeInput)) {
-      val = beforeInput(val);
-    }
+    if (isAllowedToInput(value)) {
+      updateValue(value);
 
-    currentValue.value = val;
-    setNativeDisplayValue(val);
-
-    if (doValidate()) {
-      emitUpdateValue();
-      lastValidValue = val;
+      emits('input', e, value);
     }
 
-    emits('input', e);
+    nextTick(() => {
+      keepNativeDisplayValue();
+    });
   };
 
   const handleFocus = (e: FocusEvent) => {
@@ -132,8 +220,9 @@ export function useInput(options: InputOptionT) {
     }
 
     isFocus.value = true;
-    if (format?.value) {
-      setNativeDisplayValue(currentValue.value);
+
+    if (format) {
+      displayValue.value = computedValue.value;
     }
 
     emits('focus', e);
@@ -143,14 +232,12 @@ export function useInput(options: InputOptionT) {
   const handleBlur = (e: FocusEvent) => {
     isFocus.value = false;
 
-    if (format?.value) {
-      currentValue.value = (e.target as HTMLInputElement)?.value;
-      setNativeDisplayValue(formatFn.value(currentValue.value));
-    }
+    const validValue = getValidValue();
+    updateValue(validValue);
 
-    emitValidUpdateValue();
-    emitChange();
+    emitChange(validValue);
 
+    displayValue.value = formatFn(computedValue.value);
     emits('blur', e);
   };
 
@@ -158,24 +245,22 @@ export function useInput(options: InputOptionT) {
   const handlePressEnter = (e: KeyboardEvent) => {
     const keyCode = e.key || e.code;
     if (!composition.isComposing.value && keyCode === Enter.key) {
-      emitValidUpdateValue();
+      const validValue = getValidValue();
+      updateValue(validValue);
 
-      setNativeDisplayValue(currentValue.value);
-
-      emitChange();
+      emitChange(validValue);
 
       emits('pressEnter', e);
     }
   };
 
   const clearValue = () => {
-    currentValue.value = '';
-    setNativeDisplayValue('');
+    displayValue.value = '';
+    isValid.value = true;
 
-    doValidate();
+    updateValue('');
 
-    emitUpdateValue();
-    emitChange();
+    emitChange('');
 
     emits('clear');
   };
@@ -186,18 +271,14 @@ export function useInput(options: InputOptionT) {
     clearValue();
   };
 
-  const updateValue = (val: string) => {
-    currentValue.value = val;
-    lastValue.value = currentValue.value;
-  };
-
   return {
-    realValue: computed(() => currentValue.value),
+    realValue: computed(() => computedValue.value),
     displayValue: computed(() => displayValue.value),
-    updateValue,
     isValid,
     inputEl,
     clearValue,
+    inputValueLength,
+    isOutLengthLimit,
     handleInput,
     handleFocus,
     handleBlur,
diff --git a/packages/opendesign/src/input/OInput.vue b/packages/opendesign/src/input/OInput.vue
index 6b1648d638ee898b2e50d0c5c4408ee6c3b77d6d..0e714b1da6f3f7d11996e6a21e28385ce3a3fb56 100644
--- a/packages/opendesign/src/input/OInput.vue
+++ b/packages/opendesign/src/input/OInput.vue
@@ -14,7 +14,7 @@ const props = defineProps(inputProps);
 const emits = defineEmits<{
   (e: 'update:modelValue', value: string): void;
   (e: 'change', value: string): void;
-  (e: 'input', evt: Event): void;
+  (e: 'input', evt: Event, value: string): void;
   (e: 'blur', evt: FocusEvent): void;
   (e: 'focus', evt: FocusEvent): void;
   (e: 'clear', evt?: Event): void;
@@ -33,8 +33,8 @@ const color = computed(() => {
   return props.color;
 });
 
-const onInput = (e: Event) => {
-  emits('input', e);
+const onInput = (e: Event, value: string) => {
+  emits('input', e, value);
   formItemInjection?.fieldHandlers.onInput?.();
 };
 
@@ -128,7 +128,6 @@ onMounted(() => {
         :min-length="props.minLength"
         :get-length="props.getLength"
         :input-on-outlimit="props.inputOnOutlimit"
-        :before-input="props.beforeInput"
         @change="onChange"
         @input="onInput"
         @focus="onFocus"
diff --git a/packages/opendesign/src/textarea/OTextarea.vue b/packages/opendesign/src/textarea/OTextarea.vue
index 65713d0e1045f3053932b4fcabdda97bb1029e18..7a7b18691958b5ba7650252e95a7585710134b7e 100644
--- a/packages/opendesign/src/textarea/OTextarea.vue
+++ b/packages/opendesign/src/textarea/OTextarea.vue
@@ -18,7 +18,6 @@ const emits = defineEmits<{
   (e: 'blur', evt: FocusEvent): void;
   (e: 'focus', evt: FocusEvent): void;
   (e: 'clear', evt?: Event): void;
-  (e: 'pressEnter', evt: KeyboardEvent): void;
 }>();
 
 const formItemInjection = inject(formItemInjectKey, null);
@@ -61,10 +60,6 @@ const onBlur = (e: FocusEvent) => {
   formItemInjection?.fieldHandlers.onBlur?.();
 };
 
-const onPressEnter = (e: KeyboardEvent) => {
-  emits('pressEnter', e);
-};
-
 const onClear = (e?: Event) => {
   emits('clear', e);
 };
@@ -142,12 +137,10 @@ onMounted(() => {
         :min-length="props.minLength"
         :input-on-outlimit="props.inputOnOutlimit"
         :textarea-id="textareaId"
-        :before-input="props.beforeInput"
         @change="onChange"
         @input="onInput"
         @focus="onFocus"
         @blur="onBlur"
-        @press-enter="onPressEnter"
         @clear="onClear"
         @update:model-value="onUpdatedModelValue"
       >
diff --git a/packages/opendesign/src/textarea/__demo__/TextareaAutoHeight.vue b/packages/opendesign/src/textarea/__demo__/TextareaAutoHeight.vue
index af8af909fa2ea5f78f4e823f1532388961f0c1e6..bd904f5d6212c4b82c784f7d935022df6a288939 100644
--- a/packages/opendesign/src/textarea/__demo__/TextareaAutoHeight.vue
+++ b/packages/opendesign/src/textarea/__demo__/TextareaAutoHeight.vue
@@ -13,6 +13,7 @@ setTimeout(() => {
   <h4>Auto Size</h4>
   <div>
     <div>
+      <div>default</div>
       <OTextarea v-model="val1" auto-size style="width: 300px" clearable />
     </div>
     <div>
diff --git a/packages/opendesign/src/textarea/__demo__/TextareaBasic.vue b/packages/opendesign/src/textarea/__demo__/TextareaBasic.vue
index 98c324c21c8be33bb4d7e6f0689cb844bd708086..d451fd9a057629c2c98c8385dccd3e7b58b57a82 100644
--- a/packages/opendesign/src/textarea/__demo__/TextareaBasic.vue
+++ b/packages/opendesign/src/textarea/__demo__/TextareaBasic.vue
@@ -9,12 +9,8 @@ setTimeout(() => {
   // val1.value += '---';
 }, 2000);
 
-const printEvent = (event: string, val?: string | number) => {
-  console.log(`[${event}]`, val);
-};
-
-const beforeInput = (val: string) => {
-  return val.trim();
+const onUpdateModelValue = (val: string) => {
+  val1.value = val.trim();
 };
 </script>
 <template>
@@ -114,7 +110,7 @@ const beforeInput = (val: string) => {
   <h4>beforeInput</h4>
   <section>
     <div>输入内容不允许收尾有空格</div>
-    <OTextarea v-model="val1" :max-length="10" size="large" :clearable="false" :before-input="beforeInput" />
+    <OTextarea :model-value="val1" :max-length="10" size="large" :clearable="false" @update:model-value="onUpdateModelValue" />
   </section>
 </template>
 <style lang="scss"></style>
diff --git a/packages/opendesign/src/textarea/style/style.scss b/packages/opendesign/src/textarea/style/style.scss
index a5c5394cfa3c7b72f1e4a641692e7ee9263749eb..3eb4cd0128fb47b233cbd3155c9ffed03a2c7644 100644
--- a/packages/opendesign/src/textarea/style/style.scss
+++ b/packages/opendesign/src/textarea/style/style.scss
@@ -7,10 +7,18 @@
   display: inline-flex;
   font-size: var(--textarea-text-size);
   line-height: var(--textarea-text-height);
+  .o_textarea-auto-size {
+    width: 100%;
+  }
+  .o_textarea {
+    max-height: inherit;
+  }
 }
 .o-textarea-wrap {
   width: 100%;
   height: 100%;
+  min-height: inherit;
+  max-height: inherit;
   border: 1px solid var(--textarea-bd-color);
   border-radius: var(--textarea-radius);
   background-color: var(--textarea-bg-color);
@@ -32,9 +40,7 @@
     background-color: var(--textarea-bg-color-disabled);
   }
 }
-.o-textarea-textarea {
-  display: block;
-}
+
 .o-textarea-append,
 .o-textarea-prepend {
   padding: 0 var(--textarea-padding-h);