🐛[Input.Textarea]解决Textarea组件设置 resize 为 true 时，控制宽高变化，计数器样式异常的问题

Author: liyuan-meng

src/components/input/demos/textarea.md

@@ -32,7 +32,7 @@ export default function InputDemo() {
 		<div>
 			<Input.Textarea placeholder="请输入文案，最多10个字符" style={{ width: 400 }} autoSize maxLength={10} hasCounter />
 			<br />
-			<Input.Textarea placeholder="请输入文案，高度最小3行，最大5行" rows={4} resize />
+			<Input.Textarea placeholder="请输入文案，高度最小3行，最大5行" rows={4} resize hasCounter maxLength={10}/>
 			<br />
 			<Input.Textarea placeholder="请输入文案，高度可自适应" autoSize minRows={2} />
 			<br />

src/components/input/textarea.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { createRef } from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import { noop, omit, prefixCls } from '@utils';
@@ -115,6 +115,8 @@ export default class Textarea extends React.PureComponent {
     onKeyDown: noop,
   };
 
+  ref = createRef();
+
   static getDerivedStateFromProps({ value }) {
     if (value !== undefined) {
       return { value };
@@ -140,10 +142,25 @@ export default class Textarea extends React.PureComponent {
 
   componentDidMount() {
     this.calcAutoHeight();
+
+    const textArea = this.ref?.current?.querySelector('textarea');
+    // 创建一个观察者对象
+    this.observer = new window.MutationObserver((mutations) => {
+      mutations.forEach((mutation) => {
+        if (mutation.type === 'attributes' && mutation.attributeName === 'style') {
+          this.ref.current.style.width = `${textArea.clientWidth}px`;
+        }
+      });
+    });
+    // 观察者的配置（观察属性变化）
+    const config = { attributes: true };
+    // 传入目标节点和观察选项并开始观察
+    this.observer.observe(textArea, config);
   }
 
   componentWillUnmount() {
     destory();
+    this.observer.takeRecords();
   }
 
   onKeyDown = (evt) => {
@@ -204,6 +221,7 @@ export default class Textarea extends React.PureComponent {
 
     return (
       <div
+        ref={this.ref}
         className={`${prefixCls}-input-textarea-wrapper`}
         style={wrapperStyle}
       >