vxe-pc-ui 4.1.19 → 4.1.21

package/packages/select/src/select.ts

@@ -1,12 +1,12 @@
 import { defineComponent, h, Teleport, PropType, ref, Ref, inject, computed, provide, onUnmounted, reactive, nextTick, watch, onMounted, createCommentVNode } from 'vue'
 import XEUtils from 'xe-utils'
-import { getConfig, getIcon, getI18n, globalEvents, GLOBAL_EVENT_KEYS, createEvent, useSize, VxeComponentSlotType } from '../../ui'
+import { getConfig, getIcon, getI18n, globalEvents, GLOBAL_EVENT_KEYS, createEvent, useSize } from '../../ui'
 import { getEventTargetNode, getAbsolutePos } from '../../ui/src/dom'
 import { getLastZIndex, nextZIndex, getFuncText } from '../../ui/src/utils'
 import VxeInputComponent from '../../input/src/input'
 import { getSlotVNs } from '../../ui/src/vn'
 
-import type { VxeSelectPropTypes, VxeSelectConstructor, SelectReactData, VxeSelectEmits, VxeInputConstructor, SelectMethods, SelectPrivateRef, VxeSelectMethods, VxeOptgroupProps, VxeOptionProps, VxeTableConstructor, VxeTablePrivateMethods, VxeFormDefines, VxeFormConstructor, VxeFormPrivateMethods, VxeModalConstructor, VxeModalMethods } from '../../../types'
+import type { VxeSelectPropTypes, VxeSelectConstructor, SelectInternalData, SelectReactData, VxeSelectEmits, VxeComponentSlotType, VxeInputConstructor, SelectMethods, SelectPrivateRef, VxeSelectMethods, VxeOptgroupProps, VxeOptionProps, VxeTableConstructor, VxeDrawerConstructor, VxeDrawerMethods, VxeTablePrivateMethods, VxeFormDefines, VxeFormConstructor, VxeFormPrivateMethods, VxeModalConstructor, VxeModalMethods } from '../../../types'
 
 function isOptionVisible (option: any) {
   return option.visible !== false
@@ -32,7 +32,10 @@ export default defineComponent({
       default: null
     },
     multiple: Boolean as PropType<VxeSelectPropTypes.Multiple>,
-    multiCharOverflow: { type: [Number, String] as PropType<VxeSelectPropTypes.MultiCharOverflow>, default: () => getConfig().select.multiCharOverflow },
+    multiCharOverflow: {
+      type: [Number, String] as PropType<VxeSelectPropTypes.MultiCharOverflow>,
+      default: () => getConfig().select.multiCharOverflow
+    },
     prefixIcon: String as PropType<VxeSelectPropTypes.PrefixIcon>,
     placement: String as PropType<VxeSelectPropTypes.Placement>,
     options: Array as PropType<VxeSelectPropTypes.Options>,
@@ -42,21 +45,31 @@ export default defineComponent({
     optionConfig: Object as PropType<VxeSelectPropTypes.OptionConfig>,
     className: [String, Function] as PropType<VxeSelectPropTypes.ClassName>,
     popupClassName: [String, Function] as PropType<VxeSelectPropTypes.PopupClassName>,
-    max: { type: [String, Number] as PropType<VxeSelectPropTypes.Max>, default: null },
-    size: { type: String as PropType<VxeSelectPropTypes.Size>, default: () => getConfig().select.size || getConfig().size },
+    max: {
+      type: [String, Number] as PropType<VxeSelectPropTypes.Max>,
+      default: null
+    },
+    size: {
+      type: String as PropType<VxeSelectPropTypes.Size>,
+      default: () => getConfig().select.size || getConfig().size
+    },
     filterable: Boolean as PropType<VxeSelectPropTypes.Filterable>,
     filterMethod: Function as PropType<VxeSelectPropTypes.FilterMethod>,
     remote: Boolean as PropType<VxeSelectPropTypes.Remote>,
     remoteMethod: Function as PropType<VxeSelectPropTypes.RemoteMethod>,
     emptyText: String as PropType<VxeSelectPropTypes.EmptyText>,
-    // 已废弃，被 option-config.keyField 替换
-    optionId: { type: String as PropType<VxeSelectPropTypes.OptionId>, default: () => getConfig().select.optionId },
-    // 已废弃，被 option-config.useKey 替换
-    optionKey: Boolean as PropType<VxeSelectPropTypes.OptionKey>,
     transfer: {
       type: Boolean as PropType<VxeSelectPropTypes.Transfer>,
       default: null
-    }
+    },
+
+    // 已废弃，被 option-config.keyField 替换
+    optionId: {
+      type: String as PropType<VxeSelectPropTypes.OptionId>,
+      default: () => getConfig().select.optionId
+    },
+    // 已废弃，被 option-config.useKey 替换
+    optionKey: Boolean as PropType<VxeSelectPropTypes.OptionKey>
   },
   emits: [
     'update:modelValue',
@@ -69,9 +82,10 @@ export default defineComponent({
   setup (props, context) {
     const { slots, emit } = context
 
-    const $xeModal = inject<VxeModalConstructor & VxeModalMethods | null>('$xeModal', null)
-    const $xeTable = inject<VxeTableConstructor & VxeTablePrivateMethods | null>('$xeTable', null)
-    const $xeForm = inject<VxeFormConstructor & VxeFormPrivateMethods | null>('$xeForm', null)
+    const $xeModal = inject<(VxeModalConstructor & VxeModalMethods)| null>('$xeModal', null)
+    const $xeDrawer = inject<(VxeDrawerConstructor & VxeDrawerMethods) | null>('$xeDrawer', null)
+    const $xeTable = inject<(VxeTableConstructor & VxeTablePrivateMethods) | null>('$xeTable', null)
+    const $xeForm = inject<(VxeFormConstructor & VxeFormPrivateMethods)| null>('$xeForm', null)
     const formItemInfo = inject<VxeFormDefines.ProvideItemInfo | null>('xeFormItemInfo', null)
 
     const xID = XEUtils.uniqueId()
@@ -99,6 +113,10 @@ export default defineComponent({
       searchLoading: false
     })
 
+    const internalData: SelectInternalData = {
+      hpTimeout: undefined
+    }
+
     const refElem = ref() as Ref<HTMLDivElement>
     const refInput = ref() as Ref<VxeInputConstructor>
     const refInpSearch = ref() as Ref<VxeInputConstructor>
@@ -114,6 +132,7 @@ export default defineComponent({
       props,
       context,
       reactData,
+      internalData,
       getRefMaps: () => refMaps
     } as unknown as VxeSelectConstructor & VxeSelectMethods
 
@@ -148,7 +167,7 @@ export default defineComponent({
         if (XEUtils.isBoolean(globalTransfer)) {
           return globalTransfer
         }
-        if ($xeTable || $xeModal || $xeForm) {
+        if ($xeTable || $xeModal || $xeDrawer || $xeForm) {
           return true
         }
       }
@@ -168,11 +187,11 @@ export default defineComponent({
     })
 
     const computePropsOpts = computed(() => {
-      return props.optionProps || {}
+      return Object.assign({}, props.optionProps)
     })
 
     const computeGroupPropsOpts = computed(() => {
-      return props.optionGroupProps || {}
+      return Object.assign({}, props.optionGroupProps)
     })
 
     const computeLabelField = computed(() => {
@@ -215,6 +234,28 @@ export default defineComponent({
       return XEUtils.toNumber(props.multiCharOverflow)
     })
 
+    const computeSelectLabel = computed(() => {
+      const { modelValue, multiple, remote } = props
+      const multiMaxCharNum = computeMultiMaxCharNum.value
+      if (modelValue && multiple) {
+        const vals = XEUtils.isArray(modelValue) ? modelValue : [modelValue]
+        if (remote) {
+          return vals.map(val => getRemoteSelectLabel(val)).join(', ')
+        }
+        return vals.map((val) => {
+          const label = getSelectLabel(val)
+          if (multiMaxCharNum > 0 && label.length > multiMaxCharNum) {
+            return `${label.substring(0, multiMaxCharNum)}...`
+          }
+          return label
+        }).join(', ')
+      }
+      if (remote) {
+        return getRemoteSelectLabel(modelValue)
+      }
+      return getSelectLabel(modelValue)
+    })
+
     const callSlot = <T>(slotFunc: ((params: T) => VxeComponentSlotType | VxeComponentSlotType[]) | string | null, params: T) => {
       if (slotFunc) {
         if (XEUtils.isString(slotFunc)) {
@@ -281,28 +322,6 @@ export default defineComponent({
       return XEUtils.toValueString(item ? item[labelField as 'label'] : value)
     }
 
-    const computeSelectLabel = computed(() => {
-      const { modelValue, multiple, remote } = props
-      const multiMaxCharNum = computeMultiMaxCharNum.value
-      if (modelValue && multiple) {
-        const vals = XEUtils.isArray(modelValue) ? modelValue : [modelValue]
-        if (remote) {
-          return vals.map(val => getRemoteSelectLabel(val)).join(', ')
-        }
-        return vals.map((val) => {
-          const label = getSelectLabel(val)
-          if (multiMaxCharNum > 0 && label.length > multiMaxCharNum) {
-            return `${label.substring(0, multiMaxCharNum)}...`
-          }
-          return label
-        }).join(', ')
-      }
-      if (remote) {
-        return getRemoteSelectLabel(modelValue)
-      }
-      return getSelectLabel(modelValue)
-    })
-
     const getOptkey = () => {
       const optionOpts = computeOptionOpts.value
       return optionOpts.keyField || props.optionId || '_X_OPTION_KEY'
@@ -473,13 +492,15 @@ export default defineComponent({
       })
     }
 
-    let hidePanelTimeout: number
-
     const showOptionPanel = () => {
       const { loading, filterable } = props
+      const { hpTimeout } = internalData
       const isDisabled = computeIsDisabled.value
       if (!loading && !isDisabled) {
-        clearTimeout(hidePanelTimeout)
+        if (hpTimeout) {
+          clearTimeout(hpTimeout)
+          internalData.hpTimeout = undefined
+        }
         if (!reactData.initialized) {
           reactData.initialized = true
         }
@@ -507,14 +528,14 @@ export default defineComponent({
       reactData.searchValue = ''
       reactData.searchLoading = false
       reactData.visiblePanel = false
-      hidePanelTimeout = window.setTimeout(() => {
+      internalData.hpTimeout = window.setTimeout(() => {
         reactData.isAniVisible = false
       }, 350)
     }
 
     const changeEvent = (evnt: Event, selectValue: any) => {
+      emit('update:modelValue', selectValue)
       if (selectValue !== props.modelValue) {
-        emit('update:modelValue', selectValue)
         selectMethods.dispatchEvent('change', { value: selectValue }, evnt)
         // 自动更新校验状态
         if ($xeForm && formItemInfo) {
@@ -753,19 +774,25 @@ export default defineComponent({
       reactData.isActivated = true
     }
 
-    const triggerSearchEvent = XEUtils.debounce(function () {
+    const handleSearchEvent = () => {
       const { remote, remoteMethod } = props
       const { searchValue } = reactData
       if (remote && remoteMethod) {
         reactData.searchLoading = true
-        Promise.resolve(remoteMethod({ searchValue })).then(() => nextTick()).catch(() => nextTick()).finally(() => {
-          reactData.searchLoading = false
-          refreshOption()
-        })
+        Promise.resolve(
+          remoteMethod({ searchValue })
+        ).then(() => nextTick())
+          .catch(() => nextTick())
+          .finally(() => {
+            reactData.searchLoading = false
+            refreshOption()
+          })
       } else {
         refreshOption()
       }
-    }, 350, { trailing: true })
+    }
+
+    const triggerSearchEvent = XEUtils.debounce(handleSearchEvent, 350, { trailing: true })
 
     const togglePanelEvent = (params: any) => {
       const { $event } = params
@@ -978,7 +1005,7 @@ export default defineComponent({
           }, defaultSlot ? defaultSlot({}) : []),
           h('span', {
             class: 'vxe-select-label'
-          }, selectLabel)
+          }, [selectLabel])
         ])
       }
       return h('div', {
@@ -1078,8 +1105,6 @@ export default defineComponent({
       ])
     }
 
-    $xeSelect.renderVN = renderVN
-
     watch(() => reactData.staticOptions, (value) => {
       if (value.some((item) => item.options && item.options.length)) {
         reactData.fullOptionList = []
@@ -1128,6 +1153,8 @@ export default defineComponent({
 
     provide('$xeSelect', $xeSelect)
 
+    $xeSelect.renderVN = renderVN
+
     return $xeSelect
   },
   render () {

package/packages/select/src/util.ts

@@ -5,7 +5,7 @@ import { OptionInfo } from './option-info'
 import type { VxeSelectConstructor } from '../../../types'
 
 export interface XEOptionProvide {
-  option: OptionInfo;
+  optionConfig: OptionInfo;
 }
 
 export function isOption (option: any) {
@@ -24,11 +24,11 @@ export function watchOption (props: any, option: OptionInfo) {
   })
 }
 
-export function assembleOption ($xeSelect: VxeSelectConstructor, el: HTMLDivElement, option: OptionInfo, optGroup?: XEOptionProvide | null) {
+export function assembleOption ($xeSelect: VxeSelectConstructor, el: HTMLDivElement, option: OptionInfo, $xeOptgroup?: XEOptionProvide | null) {
   const { reactData } = $xeSelect
   const { staticOptions } = reactData
   const parentElem = el.parentNode
-  const parentOption = optGroup ? optGroup.option : null
+  const parentOption = $xeOptgroup ? $xeOptgroup.optionConfig : null
   const parentCols = parentOption ? parentOption.options : staticOptions
   if (parentElem && parentCols) {
     parentCols.splice(XEUtils.arrayIndexOf(parentElem.children, el), 0, option)

package/packages/tabs/src/tab-pane.ts

@@ -1,8 +1,9 @@
 import { defineComponent, ref, h, reactive, PropType, watch, inject, onMounted, onUnmounted } from 'vue'
 import XEUtils from 'xe-utils'
+import { createEvent } from '../../ui'
 import { assembleAnchorTab, destroyAnchorTab } from './util'
 
-import type { VxeTabPanePropTypes, TabPaneReactData, TabPanePrivateRef, VxeTabPanePrivateComputed, VxeTabPaneConstructor, VxeTabPanePrivateMethods, VxeTabPaneDefines, VxeTabsConstructor, VxeTabsPrivateMethods } from '../../../types'
+import type { VxeTabPanePropTypes, TabPaneReactData, TabPaneMethods, TabPanePrivateMethods, VxeTabPaneEmits, ValueOf, TabPanePrivateRef, VxeTabPanePrivateComputed, VxeTabPaneConstructor, VxeTabPanePrivateMethods, VxeTabPaneDefines, VxeTabsConstructor, VxeTabsPrivateMethods } from '../../../types'
 
 export default defineComponent({
   name: 'VxeTabPane',
@@ -15,9 +16,9 @@ export default defineComponent({
     preload: Boolean as PropType<VxeTabPanePropTypes.Preload>,
     permissionCode: [String, Number] as PropType<VxeTabPanePropTypes.PermissionCode>
   },
-  emits: [],
+  emits: [] as VxeTabPaneEmits,
   setup (props, context) {
-    const { slots } = context
+    const { slots, emit } = context
 
     const xID = XEUtils.uniqueId()
 
@@ -59,6 +60,19 @@ export default defineComponent({
       getComputeMaps: () => computeMaps
     } as unknown as VxeTabPaneConstructor & VxeTabPanePrivateMethods
 
+    const dispatchEvent = (type: ValueOf<VxeTabPaneEmits>, params: Record<string, any>, evnt: Event | null) => {
+      emit(type, createEvent(evnt, { $tabPane: $xeTabPane }, params))
+    }
+
+    const tabPaneMethods: TabPaneMethods = {
+      dispatchEvent
+    }
+
+    const tabPanePrivateMethods: TabPanePrivateMethods = {
+    }
+
+    Object.assign($xeTabPane, tabPaneMethods, tabPanePrivateMethods)
+
     watch(() => props.title, (val) => {
       tabConfig.title = val
     })
@@ -76,8 +90,9 @@ export default defineComponent({
     })
 
     onMounted(() => {
-      if ($xeTabs && refElem.value) {
-        assembleAnchorTab($xeTabs, refElem.value, tabConfig)
+      const elem = refElem.value
+      if ($xeTabs && elem) {
+        assembleAnchorTab($xeTabs, elem, tabConfig)
       }
     })
 

package/packages/tabs/src/tabs.ts

@@ -5,7 +5,7 @@ import { toCssUnit } from '../..//ui/src/dom'
 import { warnLog } from '../../ui/src/log'
 import XEUtils from 'xe-utils'
 
-import type { VxeTabsPropTypes, VxeTabPaneProps, VxeTabsEmits, TabsReactData, TabsPrivateRef, VxeTabsPrivateComputed, VxeTabsConstructor, VxeTabsPrivateMethods, VxeTabPaneDefines, ValueOf, TabsMethods, TabsPrivateMethods } from '../../../types'
+import type { VxeTabsPropTypes, VxeTabPaneProps, VxeTabsEmits, TabsInternalData, TabsReactData, TabsPrivateRef, VxeTabsPrivateComputed, VxeTabsConstructor, VxeTabsPrivateMethods, VxeTabPaneDefines, ValueOf, TabsMethods, TabsPrivateMethods } from '../../../types'
 
 export default defineComponent({
   name: 'VxeTabs',
@@ -55,28 +55,22 @@ export default defineComponent({
       resizeFlag: 1
     })
 
-    const refMaps: TabsPrivateRef = {
-      refElem
+    const internalData: TabsInternalData = {
+      slTimeout: undefined
     }
 
-    const handleFilterTab = (item: VxeTabPaneProps | VxeTabPaneDefines.TabConfig) => {
-      const { permissionCode } = item
-      if (permissionCode) {
-        if (!permission.checkVisible(permissionCode)) {
-          return false
-        }
-      }
-      return true
+    const refMaps: TabsPrivateRef = {
+      refElem
     }
 
     const computeTabOptions = computed(() => {
       const { options } = props
-      return (options || []).filter(handleFilterTab)
+      return (options || []).filter((item) => handleFilterTab(item))
     })
 
     const computeTabStaticOptions = computed(() => {
       const { staticTabs } = reactData
-      return staticTabs.filter(handleFilterTab)
+      return staticTabs.filter((item) => handleFilterTab(item))
     })
 
     const computeMaps: VxeTabsPrivateComputed = {
@@ -92,6 +86,16 @@ export default defineComponent({
       getComputeMaps: () => computeMaps
     } as unknown as VxeTabsConstructor & VxeTabsPrivateMethods
 
+    const handleFilterTab = (item: VxeTabPaneProps | VxeTabPaneDefines.TabConfig) => {
+      const { permissionCode } = item
+      if (permissionCode) {
+        if (!permission.checkVisible(permissionCode)) {
+          return false
+        }
+      }
+      return true
+    }
+
     const callSlot = (slotFunc: any, params: any) => {
       if (slotFunc) {
         if (XEUtils.isString(slotFunc)) {
@@ -218,13 +222,15 @@ export default defineComponent({
       }
     }
 
-    let scrollTimeout: any = null
-
     const startScrollAnimation = (offsetPos: number, offsetSize: number) => {
+      const { slTimeout } = internalData
       let offsetLeft = offsetSize
       let scrollCount = 6
       let delayNum = 35
-      clearTimeout(scrollTimeout)
+      if (slTimeout) {
+        clearTimeout(slTimeout)
+        internalData.slTimeout = undefined
+      }
       const scrollAnimate = () => {
         const headerWrapperEl = refHeadWrapperElem.value
         if (scrollCount > 0) {
@@ -236,13 +242,13 @@ export default defineComponent({
               if (clientWidth + scrollLeft < scrollWidth) {
                 headerWrapperEl.scrollLeft += offsetLeft
                 delayNum -= 4
-                scrollTimeout = setTimeout(scrollAnimate, delayNum)
+                internalData.slTimeout = setTimeout(scrollAnimate, delayNum)
               }
             } else {
               if (scrollLeft > 0) {
                 headerWrapperEl.scrollLeft -= offsetLeft
                 delayNum -= 4
-                scrollTimeout = setTimeout(scrollAnimate, delayNum)
+                internalData.slTimeout = setTimeout(scrollAnimate, delayNum)
               }
             }
             updateTabStyle()
@@ -297,41 +303,43 @@ export default defineComponent({
       })
     }
 
-    const createHandlePrevNext = (isNext: boolean) => {
-      return () => {
-        const { activeName } = reactData
-        const tabOptions = computeTabOptions.value
-        const tabStaticOptions = computeTabStaticOptions.value
-        const list = tabStaticOptions.length ? tabStaticOptions : tabOptions
-        const index = XEUtils.findIndexOf(list, item => item.name === activeName)
-        if (index > -1) {
-          let item: VxeTabPaneProps | null = null
-          if (isNext) {
-            if (index < list.length - 1) {
-              item = list[index + 1]
-            }
-          } else {
-            if (index > 0) {
-              item = list[index - 1]
-            }
+    const handlePrevNext = (isNext: boolean) => {
+      const { activeName } = reactData
+      const tabOptions = computeTabOptions.value
+      const tabStaticOptions = computeTabStaticOptions.value
+      const list = tabStaticOptions.length ? tabStaticOptions : tabOptions
+      const index = XEUtils.findIndexOf(list, item => item.name === activeName)
+      if (index > -1) {
+        let item: VxeTabPaneProps | null = null
+        if (isNext) {
+          if (index < list.length - 1) {
+            item = list[index + 1]
           }
-          if (item) {
-            const name = item.name
-            const value = name
-            reactData.activeName = name
-            emit('update:modelValue', value)
-            addInitName(name, null)
+        } else {
+          if (index > 0) {
+            item = list[index - 1]
           }
         }
-        return nextTick()
+        if (item) {
+          const name = item.name
+          const value = name
+          reactData.activeName = name
+          emit('update:modelValue', value)
+          addInitName(name, null)
+        }
       }
+      return nextTick()
     }
 
     const tabsMethods: TabsMethods = {
       dispatchEvent,
       scrollToTab,
-      prev: createHandlePrevNext(false),
-      next: createHandlePrevNext(true),
+      prev () {
+        return handlePrevNext(false)
+      },
+      next () {
+        return handlePrevNext(true)
+      },
       prevTab () {
         if (process.env.VUE_APP_VXE_ENV === 'development') {
           warnLog('vxe.error.delFunc', ['prevTab', 'prev'])
@@ -475,9 +483,9 @@ export default defineComponent({
       const { activeName } = reactData
       const activeDefaultTab = tabList.find(item => item.name === activeName)
       if (destroyOnClose) {
-        return activeDefaultTab ? [renderTabPane(activeDefaultTab)] : createCommentVNode()
+        return [activeDefaultTab ? renderTabPane(activeDefaultTab) : createCommentVNode()]
       }
-      return tabList.map(renderTabPane)
+      return tabList.map((item) => renderTabPane(item))
     }
 
     const renderVN = () => {
@@ -552,7 +560,9 @@ export default defineComponent({
     }
 
     watch(() => reactData.resizeFlag, () => {
-      nextTick(updateTabStyle)
+      nextTick(() => {
+        updateTabStyle()
+      })
     })
 
     nextTick(() => {
@@ -567,13 +577,13 @@ export default defineComponent({
       globalEvents.off($xeTabs, 'resize')
     })
 
-    $xeTabs.renderVN = renderVN
-
     provide('$xeTabs', $xeTabs)
 
     addInitName(props.modelValue, null)
     initDefaultName(reactData.staticTabs.length ? reactData.staticTabs : props.options)
 
+    $xeTabs.renderVN = renderVN
+
     return $xeTabs
   },
   render () {

package/packages/textarea/src/textarea.ts

@@ -12,27 +12,45 @@ export default defineComponent({
   props: {
     modelValue: [String, Number] as PropType<VxeTextareaPropTypes.ModelValue>,
     className: String as PropType<VxeTextareaPropTypes.ClassName>,
-    immediate: { type: Boolean as PropType<VxeTextareaPropTypes.Immediate>, default: true },
+    immediate: {
+      type: Boolean as PropType<VxeTextareaPropTypes.Immediate>,
+      default: true
+    },
     name: String as PropType<VxeTextareaPropTypes.Name>,
     readonly: {
       type: Boolean as PropType<VxeTextareaPropTypes.Readonly>,
       default: null
     },
-    editable: { type: Boolean as PropType<VxeTextareaPropTypes.Readonly>, default: true },
+    editable: {
+      type: Boolean as PropType<VxeTextareaPropTypes.Readonly>,
+      default: true
+    },
     disabled: {
       type: Boolean as PropType<VxeTextareaPropTypes.Disabled>,
       default: null
     },
     placeholder: String as PropType<VxeTextareaPropTypes.Placeholder>,
     maxLength: [String, Number] as PropType<VxeTextareaPropTypes.MaxLength>,
-    rows: { type: [String, Number] as PropType<VxeTextareaPropTypes.Rows>, default: null },
-    cols: { type: [String, Number] as PropType<VxeTextareaPropTypes.Cols>, default: null },
+    rows: {
+      type: [String, Number] as PropType<VxeTextareaPropTypes.Rows>,
+      default: null
+    },
+    cols: {
+      type: [String, Number] as PropType<VxeTextareaPropTypes.Cols>,
+      default: null
+    },
     showWordCount: Boolean as PropType<VxeTextareaPropTypes.ShowWordCount>,
     countMethod: Function as PropType<VxeTextareaPropTypes.CountMethod>,
     autosize: [Boolean, Object] as PropType<VxeTextareaPropTypes.Autosize>,
     form: String as PropType<VxeTextareaPropTypes.Form>,
-    resize: { type: String as PropType<VxeTextareaPropTypes.Resize>, default: () => getConfig().textarea.resize },
-    size: { type: String as PropType<VxeTextareaPropTypes.Size>, default: () => getConfig().textarea.size || getConfig().size },
+    resize: {
+      type: String as PropType<VxeTextareaPropTypes.Resize>,
+      default: () => getConfig().textarea.resize
+    },
+    size: {
+      type: String as PropType<VxeTextareaPropTypes.Size>,
+      default: () => getConfig().textarea.size || getConfig().size
+    },
     // 已废弃
     maxlength: [String, Number] as PropType<VxeTextareaPropTypes.Maxlength>
   },
@@ -193,7 +211,7 @@ export default defineComponent({
       $xeTextarea.dispatchEvent(evnt.type, { value }, evnt)
     }
 
-    const emitUpdate = (value: string, evnt: Event) => {
+    const handleChange = (value: string, evnt: Event) => {
       reactData.inputValue = value
       emit('update:modelValue', value)
       if (XEUtils.toValueString(props.modelValue) !== value) {
@@ -211,7 +229,7 @@ export default defineComponent({
       const value = textElem.value
       reactData.inputValue = value
       if (immediate) {
-        emitUpdate(value, evnt)
+        handleChange(value, evnt)
       }
       $xeTextarea.dispatchEvent('input', { value }, evnt)
       handleResize()
@@ -222,7 +240,7 @@ export default defineComponent({
       if (immediate) {
         triggerEvent(evnt)
       } else {
-        emitUpdate(reactData.inputValue, evnt)
+        handleChange(reactData.inputValue, evnt)
       }
     }
 
@@ -230,7 +248,7 @@ export default defineComponent({
       const { immediate } = props
       const { inputValue } = reactData
       if (!immediate) {
-        emitUpdate(inputValue, evnt)
+        handleChange(inputValue, evnt)
       }
       $xeTextarea.dispatchEvent('blur', { value: inputValue }, evnt)
     }