From 275996e788fb0e492778ac8196250d9eb69c0fc4 Mon Sep 17 00:00:00 2001
From: tangjinzhou <415800467@qq.com>
Date: Fri, 11 Mar 2022 17:01:56 +0800
Subject: [PATCH] perf: typography shaking when edit

---
 components/input/ResizableTextArea.tsx | 6 ++++++
 components/input/inputProps.ts         | 1 +
 components/typography/Editable.tsx     | 1 +
 3 files changed, 8 insertions(+)

diff --git a/components/input/ResizableTextArea.tsx b/components/input/ResizableTextArea.tsx
index a12d540b1..a891ca41c 100644
--- a/components/input/ResizableTextArea.tsx
+++ b/components/input/ResizableTextArea.tsx
@@ -1,5 +1,6 @@
 import type { CSSProperties, VNode } from 'vue';
 import {
+  onMounted,
   getCurrentInstance,
   watch,
   onBeforeUnmount,
@@ -142,6 +143,11 @@ const ResizableTextArea = defineComponent({
         });
       },
     );
+    onMounted(() => {
+      nextTick(() => {
+        resizeTextarea();
+      });
+    });
     const instance = getCurrentInstance();
     expose({
       resizeTextarea,
diff --git a/components/input/inputProps.ts b/components/input/inputProps.ts
index 14dea6152..9ab449263 100644
--- a/components/input/inputProps.ts
+++ b/components/input/inputProps.ts
@@ -85,6 +85,7 @@ export interface ShowCountProps {
 }
 const textAreaProps = {
   ...omit(inputProps, ['prefix', 'addonBefore', 'addonAfter', 'suffix']),
+  rows: Number,
   autosize: { type: [Boolean, Object] as PropType<AutoSizeType>, default: undefined },
   autoSize: { type: [Boolean, Object] as PropType<AutoSizeType>, default: undefined },
   onResize: { type: Function as PropType<(size: { width: number; height: number }) => void> },
diff --git a/components/typography/Editable.tsx b/components/typography/Editable.tsx
index 4526aa554..91bb7a666 100644
--- a/components/typography/Editable.tsx
+++ b/components/typography/Editable.tsx
@@ -122,6 +122,7 @@ const Editable = defineComponent({
           onCompositionstart={onCompositionStart}
           onCompositionend={onCompositionEnd}
           onBlur={onBlur}
+          rows={1}
           autoSize={props.autoSize === undefined || props.autoSize}
         />
         {slots.enterIcon ? (