vxe-pc-ui 3.14.24 → 3.14.26

package/es/textarea/src/textarea.js

@@ -2,6 +2,7 @@ import { defineVxeComponent } from '../../ui/src/comp';
 import XEUtils from 'xe-utils';
 import { getConfig, getI18n, createEvent, globalMixins } from '../../ui';
 import { getFuncText } from '../../ui/src/utils';
+import { warnLog } from '../../ui/src/log';
 let autoTxtElem;
 export default {
     name: 'VxeTextarea',
@@ -48,7 +49,18 @@ export default {
         },
         showWordCount: Boolean,
         countMethod: Function,
-        autosize: [Boolean, Object],
+        /**
+         * 已废弃，被 auto-size 替换
+         * @deprecated
+         */
+        autosize: {
+            type: [Boolean, Object],
+            default: null
+        },
+        autoSize: {
+            type: [Boolean, Object],
+            default: null
+        },
         form: String,
         resize: {
             type: String,
@@ -76,7 +88,8 @@ export default {
         };
         return {
             xID: XEUtils.uniqueId(),
-            reactData
+            reactData,
+            reFlag: 0
         };
     },
     computed: Object.assign(Object.assign({}, {}), { computeFormReadonly() {
@@ -144,7 +157,11 @@ export default {
         computeSizeOpts() {
             const $xeTextarea = this;
             const props = $xeTextarea;
-            return Object.assign({ minRows: 1, maxRows: 10 }, getConfig().textarea.autosize, props.autosize);
+            const { autosize, autoSize } = props;
+            if (autosize || getConfig().textarea.autosize) {
+                return Object.assign({ minRows: 1, maxRows: 10 }, getConfig().textarea.autosize, autosize);
+            }
+            return Object.assign({ minRows: 1, maxRows: 10 }, getConfig().textarea.autoSize, autoSize);
         } }),
     methods: {
         //
@@ -180,16 +197,22 @@ export default {
             const $xeTextarea = this;
             const props = $xeTextarea;
             const reactData = $xeTextarea.reactData;
-            const { size, autosize } = props;
+            const { size, autosize, autoSize } = props;
             const { inputValue } = reactData;
-            if (autosize) {
+            if (autosize || autoSize) {
+                const formReadonly = $xeTextarea.computeFormReadonly;
                 if (!autoTxtElem) {
                     autoTxtElem = document.createElement('div');
                 }
                 if (!autoTxtElem.parentNode) {
                     document.body.appendChild(autoTxtElem);
                 }
-                const textElem = $xeTextarea.$refs.refTextarea;
+                const taElem = $xeTextarea.$refs.refTextarea;
+                const ctElem = $xeTextarea.$refs.refContent;
+                const textElem = formReadonly ? ctElem : taElem;
+                if (!textElem) {
+                    return;
+                }
                 if (!textElem) {
                     return;
                 }
@@ -203,11 +226,15 @@ export default {
         handleResize() {
             const $xeTextarea = this;
             const props = $xeTextarea;
-            if (props.autosize) {
+            const { autosize, autoSize } = props;
+            if (autosize || autoSize) {
                 $xeTextarea.$nextTick(() => {
                     const sizeOpts = $xeTextarea.computeSizeOpts;
+                    const formReadonly = $xeTextarea.computeFormReadonly;
                     const { minRows, maxRows } = sizeOpts;
-                    const textElem = $xeTextarea.$refs.refTextarea;
+                    const taElem = $xeTextarea.$refs.refTextarea;
+                    const ctElem = $xeTextarea.$refs.refContent;
+                    const textElem = formReadonly ? ctElem : taElem;
                     if (!textElem) {
                         return;
                     }
@@ -302,7 +329,7 @@ export default {
             const $xeTextarea = this;
             const props = $xeTextarea;
             const reactData = $xeTextarea.reactData;
-            const { className, resize, autosize, showWordCount, countMethod, rows, cols } = props;
+            const { className, resize, autosize, autoSize, showWordCount, countMethod, rows, cols } = props;
             const { inputValue } = reactData;
             const vSize = $xeTextarea.computeSize;
             const isDisabled = $xeTextarea.computeIsDisabled;
@@ -316,13 +343,18 @@ export default {
                 return h('div', {
                     ref: 'refElem',
                     class: ['vxe-textarea--readonly', className]
-                }, inputValue);
+                }, [
+                    h('div', {
+                        ref: 'refContent',
+                        class: 'vxe-textarea--content'
+                    }, inputValue)
+                ]);
             }
             return h('div', {
                 ref: 'refElem',
                 class: ['vxe-textarea', className, {
                         [`size--${vSize}`]: vSize,
-                        'is--autosize': autosize,
+                        'is--autosize': autosize || autoSize,
                         'is--count': showWordCount,
                         'is--disabled': isDisabled,
                         'is--rows': !XEUtils.eqNull(rows),
@@ -379,7 +411,23 @@ export default {
             reactData.inputValue = val;
             $xeTextarea.updateAutoTxt();
         },
+        computeFormReadonly() {
+            const $xeTextarea = this;
+            $xeTextarea.reFlag++;
+        },
         computeSizeOpts() {
+            const $xeTextarea = this;
+            $xeTextarea.reFlag++;
+        },
+        autoSize() {
+            const $xeTextarea = this;
+            $xeTextarea.reFlag++;
+        },
+        autosize() {
+            const $xeTextarea = this;
+            $xeTextarea.reFlag++;
+        },
+        reFlag() {
             const $xeTextarea = this;
             $xeTextarea.updateAutoTxt();
             $xeTextarea.handleResize();
@@ -391,8 +439,11 @@ export default {
         const reactData = $xeTextarea.reactData;
         reactData.inputValue = props.value;
         $xeTextarea.$nextTick(() => {
-            const { autosize } = props;
+            const { autosize, autoSize } = props;
             if (autosize) {
+                warnLog('vxe.error.delProp', ['autosize', 'auto-size']);
+            }
+            if (autosize || autoSize) {
                 $xeTextarea.updateAutoTxt();
                 $xeTextarea.handleResize();
             }

package/es/textarea/style.css

@@ -11,15 +11,21 @@
 }
 
 .vxe-textarea--readonly {
-  color: var(--vxe-ui-font-color);
-  display: inline-flex;
+  display: flex;
+}
+
+.vxe-textarea--content {
+  width: 100%;
+  padding: 0.3em 0.6em;
+  overflow: auto;
+  white-space: pre-wrap;
+  word-break: break-word;
 }
 
 .vxe-textarea--inner {
   border-radius: var(--vxe-ui-base-border-radius);
   outline: 0;
   font-size: inherit;
-  padding: 0 0.6em;
   color: var(--vxe-ui-font-color);
   line-height: inherit;
   border: 1px solid var(--vxe-ui-input-border-color);
@@ -46,7 +52,8 @@
 }
 
 .vxe-textarea--inner,
-.vxe-textarea--autosize {
+.vxe-textarea--autosize,
+.vxe-textarea--content {
   line-height: 1.5715;
   color: var(--vxe-ui-font-color);
   font-family: var(--vxe-ui-font-family);

package/es/textarea/style.min.css

@@ -1 +1 @@
-.vxe-textarea{position:relative;display:inline-flex;flex-direction:row}.vxe-textarea:not(.is--cols){width:100%}.vxe-textarea:not(.is--cols) .vxe-textarea--inner{width:100%}.vxe-textarea--readonly{color:var(--vxe-ui-font-color);display:inline-flex}.vxe-textarea--inner{border-radius:var(--vxe-ui-base-border-radius);outline:0;font-size:inherit;padding:0 .6em;color:var(--vxe-ui-font-color);line-height:inherit;border:1px solid var(--vxe-ui-input-border-color);background-color:var(--vxe-ui-layout-background-color);display:block;padding:.3em .6em}.vxe-textarea--inner::-moz-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner:-ms-input-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner::placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner:focus{border:1px solid var(--vxe-ui-font-primary-color)}.vxe-textarea--inner[disabled]{cursor:not-allowed;color:var(--vxe-ui-font-disabled-color);background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-textarea--autosize,.vxe-textarea--inner{line-height:1.5715;color:var(--vxe-ui-font-color);font-family:var(--vxe-ui-font-family)}.vxe-textarea--autosize{display:block;position:fixed;top:0;left:0;width:100%;margin:0;padding:.3em .6em;word-wrap:break-word;white-space:pre-wrap;z-index:-1;visibility:hidden}.vxe-textarea--count{position:absolute;bottom:.2em;right:1.4em;padding-left:.2em;color:var(--vxe-ui-input-count-color);background-color:var(--vxe-ui-layout-background-color)}.vxe-textarea--count.is--error{color:var(--vxe-ui-input-count-error-color)}.vxe-textarea,.vxe-textarea--autosize{font-size:var(--vxe-ui-font-size-default)}.vxe-textarea--autosize.size--medium,.vxe-textarea.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-textarea--autosize.size--small,.vxe-textarea.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-textarea--autosize.size--mini,.vxe-textarea.size--mini{font-size:var(--vxe-ui-font-size-mini)}.vxe-textarea:not(.is--autosize){min-height:var(--vxe-ui-input-height-default)}.vxe-textarea.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-textarea.size--medium:not(.is--autosize){min-height:var(--vxe-ui-input-height-medium)}.vxe-textarea.size--small:not(.is--autosize){min-height:var(--vxe-ui-input-height-small)}.vxe-textarea.size--mini:not(.is--autosize){min-height:var(--vxe-ui-input-height-mini)}
+.vxe-textarea{position:relative;display:inline-flex;flex-direction:row}.vxe-textarea:not(.is--cols){width:100%}.vxe-textarea:not(.is--cols) .vxe-textarea--inner{width:100%}.vxe-textarea--readonly{display:flex}.vxe-textarea--content{width:100%;padding:.3em .6em;overflow:auto;white-space:pre-wrap;word-break:break-word}.vxe-textarea--inner{border-radius:var(--vxe-ui-base-border-radius);outline:0;font-size:inherit;color:var(--vxe-ui-font-color);line-height:inherit;border:1px solid var(--vxe-ui-input-border-color);background-color:var(--vxe-ui-layout-background-color);display:block;padding:.3em .6em}.vxe-textarea--inner::-moz-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner:-ms-input-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner::placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner:focus{border:1px solid var(--vxe-ui-font-primary-color)}.vxe-textarea--inner[disabled]{cursor:not-allowed;color:var(--vxe-ui-font-disabled-color);background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-textarea--autosize,.vxe-textarea--content,.vxe-textarea--inner{line-height:1.5715;color:var(--vxe-ui-font-color);font-family:var(--vxe-ui-font-family)}.vxe-textarea--autosize{display:block;position:fixed;top:0;left:0;width:100%;margin:0;padding:.3em .6em;word-wrap:break-word;white-space:pre-wrap;z-index:-1;visibility:hidden}.vxe-textarea--count{position:absolute;bottom:.2em;right:1.4em;padding-left:.2em;color:var(--vxe-ui-input-count-color);background-color:var(--vxe-ui-layout-background-color)}.vxe-textarea--count.is--error{color:var(--vxe-ui-input-count-error-color)}.vxe-textarea,.vxe-textarea--autosize{font-size:var(--vxe-ui-font-size-default)}.vxe-textarea--autosize.size--medium,.vxe-textarea.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-textarea--autosize.size--small,.vxe-textarea.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-textarea--autosize.size--mini,.vxe-textarea.size--mini{font-size:var(--vxe-ui-font-size-mini)}.vxe-textarea:not(.is--autosize){min-height:var(--vxe-ui-input-height-default)}.vxe-textarea.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-textarea.size--medium:not(.is--autosize){min-height:var(--vxe-ui-input-height-medium)}.vxe-textarea.size--small:not(.is--autosize){min-height:var(--vxe-ui-input-height-small)}.vxe-textarea.size--mini:not(.is--autosize){min-height:var(--vxe-ui-input-height-mini)}

package/es/ui/index.js

@@ -1,7 +1,7 @@
 import { VxeUI, setConfig, setIcon } from '@vxe-ui/core';
 import { dynamicApp } from '../dynamics';
 import { warnLog } from './src/log';
-export const version = "3.14.24";
+export const version = "3.14.26";
 VxeUI.uiVersion = version;
 VxeUI.dynamicApp = dynamicApp;
 export function config(options) {

package/es/ui/src/log.js

@@ -1,4 +1,4 @@
 import { log } from '@vxe-ui/core';
-const version = `ui v${"3.14.24"}`;
+const version = `ui v${"3.14.26"}`;
 export const warnLog = log.create('warn', version);
 export const errLog = log.create('error', version);

package/es/vxe-textarea/style.css

@@ -11,15 +11,21 @@
 }
 
 .vxe-textarea--readonly {
-  color: var(--vxe-ui-font-color);
-  display: inline-flex;
+  display: flex;
+}
+
+.vxe-textarea--content {
+  width: 100%;
+  padding: 0.3em 0.6em;
+  overflow: auto;
+  white-space: pre-wrap;
+  word-break: break-word;
 }
 
 .vxe-textarea--inner {
   border-radius: var(--vxe-ui-base-border-radius);
   outline: 0;
   font-size: inherit;
-  padding: 0 0.6em;
   color: var(--vxe-ui-font-color);
   line-height: inherit;
   border: 1px solid var(--vxe-ui-input-border-color);
@@ -46,7 +52,8 @@
 }
 
 .vxe-textarea--inner,
-.vxe-textarea--autosize {
+.vxe-textarea--autosize,
+.vxe-textarea--content {
   line-height: 1.5715;
   color: var(--vxe-ui-font-color);
   font-family: var(--vxe-ui-font-family);

package/es/vxe-textarea/style.min.css

@@ -1 +1 @@
-.vxe-textarea{position:relative;display:inline-flex;flex-direction:row}.vxe-textarea:not(.is--cols){width:100%}.vxe-textarea:not(.is--cols) .vxe-textarea--inner{width:100%}.vxe-textarea--readonly{color:var(--vxe-ui-font-color);display:inline-flex}.vxe-textarea--inner{border-radius:var(--vxe-ui-base-border-radius);outline:0;font-size:inherit;padding:0 .6em;color:var(--vxe-ui-font-color);line-height:inherit;border:1px solid var(--vxe-ui-input-border-color);background-color:var(--vxe-ui-layout-background-color);display:block;padding:.3em .6em}.vxe-textarea--inner::-moz-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner:-ms-input-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner::placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner:focus{border:1px solid var(--vxe-ui-font-primary-color)}.vxe-textarea--inner[disabled]{cursor:not-allowed;color:var(--vxe-ui-font-disabled-color);background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-textarea--autosize,.vxe-textarea--inner{line-height:1.5715;color:var(--vxe-ui-font-color);font-family:var(--vxe-ui-font-family)}.vxe-textarea--autosize{display:block;position:fixed;top:0;left:0;width:100%;margin:0;padding:.3em .6em;word-wrap:break-word;white-space:pre-wrap;z-index:-1;visibility:hidden}.vxe-textarea--count{position:absolute;bottom:.2em;right:1.4em;padding-left:.2em;color:var(--vxe-ui-input-count-color);background-color:var(--vxe-ui-layout-background-color)}.vxe-textarea--count.is--error{color:var(--vxe-ui-input-count-error-color)}.vxe-textarea,.vxe-textarea--autosize{font-size:var(--vxe-ui-font-size-default)}.vxe-textarea--autosize.size--medium,.vxe-textarea.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-textarea--autosize.size--small,.vxe-textarea.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-textarea--autosize.size--mini,.vxe-textarea.size--mini{font-size:var(--vxe-ui-font-size-mini)}.vxe-textarea:not(.is--autosize){min-height:var(--vxe-ui-input-height-default)}.vxe-textarea.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-textarea.size--medium:not(.is--autosize){min-height:var(--vxe-ui-input-height-medium)}.vxe-textarea.size--small:not(.is--autosize){min-height:var(--vxe-ui-input-height-small)}.vxe-textarea.size--mini:not(.is--autosize){min-height:var(--vxe-ui-input-height-mini)}
+.vxe-textarea{position:relative;display:inline-flex;flex-direction:row}.vxe-textarea:not(.is--cols){width:100%}.vxe-textarea:not(.is--cols) .vxe-textarea--inner{width:100%}.vxe-textarea--readonly{display:flex}.vxe-textarea--content{width:100%;padding:.3em .6em;overflow:auto;white-space:pre-wrap;word-break:break-word}.vxe-textarea--inner{border-radius:var(--vxe-ui-base-border-radius);outline:0;font-size:inherit;color:var(--vxe-ui-font-color);line-height:inherit;border:1px solid var(--vxe-ui-input-border-color);background-color:var(--vxe-ui-layout-background-color);display:block;padding:.3em .6em}.vxe-textarea--inner::-moz-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner:-ms-input-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner::placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner:focus{border:1px solid var(--vxe-ui-font-primary-color)}.vxe-textarea--inner[disabled]{cursor:not-allowed;color:var(--vxe-ui-font-disabled-color);background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-textarea--autosize,.vxe-textarea--content,.vxe-textarea--inner{line-height:1.5715;color:var(--vxe-ui-font-color);font-family:var(--vxe-ui-font-family)}.vxe-textarea--autosize{display:block;position:fixed;top:0;left:0;width:100%;margin:0;padding:.3em .6em;word-wrap:break-word;white-space:pre-wrap;z-index:-1;visibility:hidden}.vxe-textarea--count{position:absolute;bottom:.2em;right:1.4em;padding-left:.2em;color:var(--vxe-ui-input-count-color);background-color:var(--vxe-ui-layout-background-color)}.vxe-textarea--count.is--error{color:var(--vxe-ui-input-count-error-color)}.vxe-textarea,.vxe-textarea--autosize{font-size:var(--vxe-ui-font-size-default)}.vxe-textarea--autosize.size--medium,.vxe-textarea.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-textarea--autosize.size--small,.vxe-textarea.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-textarea--autosize.size--mini,.vxe-textarea.size--mini{font-size:var(--vxe-ui-font-size-mini)}.vxe-textarea:not(.is--autosize){min-height:var(--vxe-ui-input-height-default)}.vxe-textarea.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-textarea.size--medium:not(.is--autosize){min-height:var(--vxe-ui-input-height-medium)}.vxe-textarea.size--small:not(.is--autosize){min-height:var(--vxe-ui-input-height-small)}.vxe-textarea.size--mini:not(.is--autosize){min-height:var(--vxe-ui-input-height-mini)}

package/lib/index.umd.js

@@ -13214,7 +13214,7 @@ function checkDynamic() {
 }
 ;// ./packages/ui/src/log.ts
 
-var log_version = "ui v".concat("3.14.24");
+var log_version = "ui v".concat("3.14.26");
 var warnLog = log.create('warn', log_version);
 var errLog = log.create('error', log_version);
 ;// ./packages/ui/index.ts
@@ -13222,7 +13222,7 @@ var errLog = log.create('error', log_version);
 
 
 
-var ui_version = "3.14.24";
+var ui_version = "3.14.26";
 VxeUI.uiVersion = ui_version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -55632,6 +55632,7 @@ var Text = VxeText;
 
 
 
+
 var autoTxtElem;
 /* harmony default export */ var src_textarea = (/* define-vxe-component start */defineVxeComponent({
   name: 'VxeTextarea',
@@ -55678,7 +55679,18 @@ var autoTxtElem;
     },
     showWordCount: Boolean,
     countMethod: Function,
-    autosize: [Boolean, Object],
+    /**
+     * 已废弃，被 auto-size 替换
+     * @deprecated
+     */
+    autosize: {
+      type: [Boolean, Object],
+      default: null
+    },
+    autoSize: {
+      type: [Boolean, Object],
+      default: null
+    },
     form: String,
     resize: {
       type: String,
@@ -55710,7 +55722,8 @@ var autoTxtElem;
     };
     return {
       xID: external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId(),
-      reactData: reactData
+      reactData: reactData,
+      reFlag: 0
     };
   },
   computed: _objectSpread2(_objectSpread2({}, {}), {}, {
@@ -55781,10 +55794,18 @@ var autoTxtElem;
     computeSizeOpts: function computeSizeOpts() {
       var $xeTextarea = this;
       var props = $xeTextarea;
+      var autosize = props.autosize,
+        autoSize = props.autoSize;
+      if (autosize || getConfig().textarea.autosize) {
+        return Object.assign({
+          minRows: 1,
+          maxRows: 10
+        }, getConfig().textarea.autosize, autosize);
+      }
       return Object.assign({
         minRows: 1,
         maxRows: 10
-      }, getConfig().textarea.autosize, props.autosize);
+      }, getConfig().textarea.autoSize, autoSize);
     }
   }),
   methods: {
@@ -55823,16 +55844,23 @@ var autoTxtElem;
       var props = $xeTextarea;
       var reactData = $xeTextarea.reactData;
       var size = props.size,
-        autosize = props.autosize;
+        autosize = props.autosize,
+        autoSize = props.autoSize;
       var inputValue = reactData.inputValue;
-      if (autosize) {
+      if (autosize || autoSize) {
+        var formReadonly = $xeTextarea.computeFormReadonly;
         if (!autoTxtElem) {
           autoTxtElem = document.createElement('div');
         }
         if (!autoTxtElem.parentNode) {
           document.body.appendChild(autoTxtElem);
         }
-        var textElem = $xeTextarea.$refs.refTextarea;
+        var taElem = $xeTextarea.$refs.refTextarea;
+        var ctElem = $xeTextarea.$refs.refContent;
+        var textElem = formReadonly ? ctElem : taElem;
+        if (!textElem) {
+          return;
+        }
         if (!textElem) {
           return;
         }
@@ -55846,12 +55874,17 @@ var autoTxtElem;
     handleResize: function handleResize() {
       var $xeTextarea = this;
       var props = $xeTextarea;
-      if (props.autosize) {
+      var autosize = props.autosize,
+        autoSize = props.autoSize;
+      if (autosize || autoSize) {
         $xeTextarea.$nextTick(function () {
           var sizeOpts = $xeTextarea.computeSizeOpts;
+          var formReadonly = $xeTextarea.computeFormReadonly;
           var minRows = sizeOpts.minRows,
             maxRows = sizeOpts.maxRows;
-          var textElem = $xeTextarea.$refs.refTextarea;
+          var taElem = $xeTextarea.$refs.refTextarea;
+          var ctElem = $xeTextarea.$refs.refContent;
+          var textElem = formReadonly ? ctElem : taElem;
           if (!textElem) {
             return;
           }
@@ -55957,6 +55990,7 @@ var autoTxtElem;
       var className = props.className,
         resize = props.resize,
         autosize = props.autosize,
+        autoSize = props.autoSize,
         showWordCount = props.showWordCount,
         countMethod = props.countMethod,
         rows = props.rows,
@@ -55974,11 +56008,14 @@ var autoTxtElem;
         return h('div', {
           ref: 'refElem',
           class: ['vxe-textarea--readonly', className]
-        }, inputValue);
+        }, [h('div', {
+          ref: 'refContent',
+          class: 'vxe-textarea--content'
+        }, inputValue)]);
       }
       return h('div', {
         ref: 'refElem',
-        class: ['vxe-textarea', className, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--autosize', autosize), 'is--count', showWordCount), 'is--disabled', isDisabled), 'is--rows', !external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(rows)), 'is--cols', !external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(cols))],
+        class: ['vxe-textarea', className, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--autosize', autosize || autoSize), 'is--count', showWordCount), 'is--disabled', isDisabled), 'is--rows', !external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(rows)), 'is--cols', !external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(cols))],
         attrs: {
           spellcheck: false
         }
@@ -56025,7 +56062,23 @@ var autoTxtElem;
       reactData.inputValue = val;
       $xeTextarea.updateAutoTxt();
     },
+    computeFormReadonly: function computeFormReadonly() {
+      var $xeTextarea = this;
+      $xeTextarea.reFlag++;
+    },
     computeSizeOpts: function computeSizeOpts() {
+      var $xeTextarea = this;
+      $xeTextarea.reFlag++;
+    },
+    autoSize: function autoSize() {
+      var $xeTextarea = this;
+      $xeTextarea.reFlag++;
+    },
+    autosize: function autosize() {
+      var $xeTextarea = this;
+      $xeTextarea.reFlag++;
+    },
+    reFlag: function reFlag() {
       var $xeTextarea = this;
       $xeTextarea.updateAutoTxt();
       $xeTextarea.handleResize();
@@ -56037,8 +56090,12 @@ var autoTxtElem;
     var reactData = $xeTextarea.reactData;
     reactData.inputValue = props.value;
     $xeTextarea.$nextTick(function () {
-      var autosize = props.autosize;
+      var autosize = props.autosize,
+        autoSize = props.autoSize;
       if (autosize) {
+        warnLog('vxe.error.delProp', ['autosize', 'auto-size']);
+      }
+      if (autosize || autoSize) {
         $xeTextarea.updateAutoTxt();
         $xeTextarea.handleResize();
       }