From 10fcc59ed48eca144b2f5f8e1f8984fe1e6cff5a Mon Sep 17 00:00:00 2001 From: jiaxiang Date: Mon, 28 Oct 2024 15:36:44 +0800 Subject: [PATCH] refactor: replace Array.isArray with the built-in isArray (#18671) chore(components): [descriptions] isArray replace Array.isArray --- packages/components/cascader-panel/src/node.ts | 5 +++-- .../src/composables/use-basic-date-table.ts | 4 ++-- .../src/date-picker-com/panel-date-pick.vue | 2 +- packages/components/form/src/form-item.vue | 3 ++- packages/components/image/src/image.vue | 3 ++- packages/components/menu/src/menu-item.ts | 9 +++++++-- packages/components/menu/src/menu.ts | 3 ++- .../components/pagination/src/components/sizes.vue | 3 ++- .../components/slider/src/composables/use-lifecycle.ts | 3 ++- .../components/slider/src/composables/use-watch.ts | 8 ++++---- .../components/table-v2/src/composables/use-data.ts | 3 ++- packages/components/table/src/store/tree.ts | 5 +++-- packages/components/table/src/store/watcher.ts | 6 +++--- .../components/table/src/table-body/styles-helper.ts | 3 ++- packages/components/table/src/table-column/index.ts | 6 +++--- .../components/table/src/table-column/render-helper.ts | 6 +++--- packages/components/table/src/util.ts | 6 +++--- packages/components/tree-select/src/utils.ts | 6 ++++-- packages/components/tree/src/model/node.ts | 10 +++++----- packages/components/watermark/src/useClips.ts | 4 +++- packages/components/watermark/src/watermark.vue | 3 ++- packages/directives/click-outside/index.ts | 4 ++-- packages/utils/arrays.ts | 4 +++- packages/utils/vue/vnode.ts | 2 +- 24 files changed, 66 insertions(+), 45 deletions(-) diff --git a/packages/components/cascader-panel/src/node.ts b/packages/components/cascader-panel/src/node.ts index 2624710432..af1f19ad84 100644 --- a/packages/components/cascader-panel/src/node.ts +++ b/packages/components/cascader-panel/src/node.ts @@ -1,6 +1,7 @@ // @ts-nocheck import { capitalize, + isArray, isEmpty, isFunction, isUndefined, @@ -137,7 +138,7 @@ class Node { return isUndefined(isLeaf) ? lazy && !loaded ? false - : !(Array.isArray(childrenData) && childrenData.length) + : !(isArray(childrenData) && childrenData.length) : !!isLeaf } @@ -149,7 +150,7 @@ class Node { const { childrenData, children } = this const node = new Node(childData, this.config, this) - if (Array.isArray(childrenData)) { + if (isArray(childrenData)) { childrenData.push(childData) } else { this.childrenData = [childData] diff --git a/packages/components/date-picker/src/composables/use-basic-date-table.ts b/packages/components/date-picker/src/composables/use-basic-date-table.ts index 157c8cc71c..68089b8d09 100644 --- a/packages/components/date-picker/src/composables/use-basic-date-table.ts +++ b/packages/components/date-picker/src/composables/use-basic-date-table.ts @@ -2,7 +2,7 @@ import { computed, nextTick, ref, unref, watch } from 'vue' import dayjs from 'dayjs' import { flatten } from 'lodash-unified' import { useLocale, useNamespace } from '@element-plus/hooks' -import { castArray } from '@element-plus/utils' +import { castArray, isArray } from '@element-plus/utils' import { buildPickerTable } from '../utils' import type { SetupContext } from 'vue' @@ -373,7 +373,7 @@ export const useBasicDateTable = ( newDate = newDate.date(Number.parseInt(cell.text as any, 10)) - if (props.parsedValue && !Array.isArray(props.parsedValue)) { + if (props.parsedValue && !isArray(props.parsedValue)) { const dayOffset = ((props.parsedValue.day() - firstDayOfWeek + 7) % 7) - 1 const weekDate = props.parsedValue.subtract(dayOffset, 'day') return weekDate.isSame(newDate, 'day') diff --git a/packages/components/date-picker/src/date-picker-com/panel-date-pick.vue b/packages/components/date-picker/src/date-picker-com/panel-date-pick.vue index da45843d3a..8d485eb9e6 100644 --- a/packages/components/date-picker/src/date-picker-com/panel-date-pick.vue +++ b/packages/components/date-picker/src/date-picker-com/panel-date-pick.vue @@ -815,7 +815,7 @@ watch( (val) => { if (val) { if (isMultipleType.value) return - if (Array.isArray(val)) return + if (isArray(val)) return innerDate.value = val } else { innerDate.value = getDefaultValue() diff --git a/packages/components/form/src/form-item.vue b/packages/components/form/src/form-item.vue index 40e873c02a..e3718ff720 100644 --- a/packages/components/form/src/form-item.vue +++ b/packages/components/form/src/form-item.vue @@ -57,6 +57,7 @@ import { addUnit, ensureArray, getProp, + isArray, isBoolean, isFunction, isString, @@ -231,7 +232,7 @@ const getFilteredRule = (trigger: string) => { rules .filter((rule) => { if (!rule.trigger || !trigger) return true - if (Array.isArray(rule.trigger)) { + if (isArray(rule.trigger)) { return rule.trigger.includes(trigger) } else { return rule.trigger === trigger diff --git a/packages/components/image/src/image.vue b/packages/components/image/src/image.vue index 141b1d9517..ba24edb307 100644 --- a/packages/components/image/src/image.vue +++ b/packages/components/image/src/image.vue @@ -62,6 +62,7 @@ import { useAttrs, useLocale, useNamespace } from '@element-plus/hooks' import ImageViewer from '@element-plus/components/image-viewer' import { getScrollContainer, + isArray, isClient, isElement, isInContainer, @@ -127,7 +128,7 @@ const imageStyle = computed(() => { const preview = computed(() => { const { previewSrcList } = props - return Array.isArray(previewSrcList) && previewSrcList.length > 0 + return isArray(previewSrcList) && previewSrcList.length > 0 }) const imageIndex = computed(() => { diff --git a/packages/components/menu/src/menu-item.ts b/packages/components/menu/src/menu-item.ts index 672561a554..8ccd4566fb 100644 --- a/packages/components/menu/src/menu-item.ts +++ b/packages/components/menu/src/menu-item.ts @@ -1,4 +1,9 @@ -import { buildProps, definePropType, isString } from '@element-plus/utils' +import { + buildProps, + definePropType, + isArray, + isString, +} from '@element-plus/utils' import type { ExtractPropTypes } from 'vue' import type { RouteLocationRaw } from 'vue-router' @@ -27,6 +32,6 @@ export type MenuItemProps = ExtractPropTypes export const menuItemEmits = { click: (item: MenuItemRegistered) => - isString(item.index) && Array.isArray(item.indexPath), + isString(item.index) && isArray(item.indexPath), } export type MenuItemEmits = typeof menuItemEmits diff --git a/packages/components/menu/src/menu.ts b/packages/components/menu/src/menu.ts index c318a60557..ba8940f683 100644 --- a/packages/components/menu/src/menu.ts +++ b/packages/components/menu/src/menu.ts @@ -22,6 +22,7 @@ import { definePropType, flattedChildren, iconPropType, + isArray, isObject, isString, mutable, @@ -164,7 +165,7 @@ export const menuProps = buildProps({ export type MenuProps = ExtractPropTypes const checkIndexPath = (indexPath: unknown): indexPath is string[] => - Array.isArray(indexPath) && indexPath.every((path) => isString(path)) + isArray(indexPath) && indexPath.every((path) => isString(path)) export const menuEmits = { close: (index: string, indexPath: string[]) => diff --git a/packages/components/pagination/src/components/sizes.vue b/packages/components/pagination/src/components/sizes.vue index 180fb0f79e..8ab0b7f0e8 100644 --- a/packages/components/pagination/src/components/sizes.vue +++ b/packages/components/pagination/src/components/sizes.vue @@ -25,6 +25,7 @@ import { computed, ref, watch } from 'vue' import { isEqual } from 'lodash-unified' import { ElOption, ElSelect } from '@element-plus/components/select' import { useLocale, useNamespace } from '@element-plus/hooks' +import { isArray } from '@element-plus/utils' import { usePagination } from '../usePagination' import { paginationSizesProps } from './sizes' @@ -43,7 +44,7 @@ watch( () => props.pageSizes, (newVal, oldVal) => { if (isEqual(newVal, oldVal)) return - if (Array.isArray(newVal)) { + if (isArray(newVal)) { const pageSize = newVal.includes(props.pageSize!) ? props.pageSize : props.pageSizes[0] diff --git a/packages/components/slider/src/composables/use-lifecycle.ts b/packages/components/slider/src/composables/use-lifecycle.ts index 23c974bedd..6b3e770d04 100644 --- a/packages/components/slider/src/composables/use-lifecycle.ts +++ b/packages/components/slider/src/composables/use-lifecycle.ts @@ -1,5 +1,6 @@ import { nextTick, onMounted, ref } from 'vue' import { useEventListener } from '@vueuse/core' +import { isArray } from '@element-plus/utils' import type { SliderInitData, SliderProps } from '../slider' export const useLifecycle = ( @@ -11,7 +12,7 @@ export const useLifecycle = ( onMounted(async () => { if (props.range) { - if (Array.isArray(props.modelValue)) { + if (isArray(props.modelValue)) { initData.firstValue = Math.max(props.min, props.modelValue[0]) initData.secondValue = Math.min(props.max, props.modelValue[1]) } else { diff --git a/packages/components/slider/src/composables/use-watch.ts b/packages/components/slider/src/composables/use-watch.ts index 40f711b375..ce9690090e 100644 --- a/packages/components/slider/src/composables/use-watch.ts +++ b/packages/components/slider/src/composables/use-watch.ts @@ -1,6 +1,6 @@ import { watch } from 'vue' import { INPUT_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants' -import { debugWarn, throwError } from '@element-plus/utils' +import { debugWarn, isArray, throwError } from '@element-plus/utils' import type { ComputedRef, SetupContext } from 'vue' import type { Arrayable } from '@element-plus/utils' import type { FormItemContext } from '@element-plus/components/form' @@ -34,7 +34,7 @@ export const useWatch = ( throwError('Slider', 'min should not be greater than max.') } const val = props.modelValue - if (props.range && Array.isArray(val)) { + if (props.range && isArray(val)) { if (val[1] < props.min) { _emit([props.min, props.min]) } else if (val[0] > props.max) { @@ -86,8 +86,8 @@ export const useWatch = ( (val, oldVal) => { if ( initData.dragging || - (Array.isArray(val) && - Array.isArray(oldVal) && + (isArray(val) && + isArray(oldVal) && val.every((item, index) => item === oldVal[index]) && initData.firstValue === val[0] && initData.secondValue === val[1]) diff --git a/packages/components/table-v2/src/composables/use-data.ts b/packages/components/table-v2/src/composables/use-data.ts index 33dd85eefa..5671518b84 100644 --- a/packages/components/table-v2/src/composables/use-data.ts +++ b/packages/components/table-v2/src/composables/use-data.ts @@ -1,4 +1,5 @@ import { computed, ref, unref, watch } from 'vue' +import { isArray } from '@element-plus/utils' import type { TableV2Props } from '../table' import type { KeyType } from '../types' @@ -36,7 +37,7 @@ export const useData = ( array.push(item) if ( keysSet.has(item[rowKey]) && - Array.isArray(item.children) && + isArray(item.children) && item.children.length > 0 ) { copy = [...item.children, ...copy] diff --git a/packages/components/table/src/store/tree.ts b/packages/components/table/src/store/tree.ts index 623db375fd..050771dd05 100644 --- a/packages/components/table/src/store/tree.ts +++ b/packages/components/table/src/store/tree.ts @@ -1,5 +1,6 @@ // @ts-nocheck import { computed, getCurrentInstance, ref, unref, watch } from 'vue' +import { isArray } from '@element-plus/utils' import { getRowIdentity, walkTreeNode } from '../util' import type { WatcherPropsData } from '.' @@ -48,7 +49,7 @@ function useTree(watcherData: WatcherPropsData) { data, (parent, children, level) => { const parentId = getRowIdentity(parent, rowKey) - if (Array.isArray(children)) { + if (isArray(children)) { res[parentId] = { children: children.map((row) => getRowIdentity(row, rowKey)), level, @@ -195,7 +196,7 @@ function useTree(watcherData: WatcherPropsData) { if (load && !treeData.value[key].loaded) { treeData.value[key].loading = true load(row, treeNode, (data) => { - if (!Array.isArray(data)) { + if (!isArray(data)) { throw new TypeError('[ElTable] data must be an array') } treeData.value[key].loading = false diff --git a/packages/components/table/src/store/watcher.ts b/packages/components/table/src/store/watcher.ts index ca77c73a6f..0aecd6c84f 100644 --- a/packages/components/table/src/store/watcher.ts +++ b/packages/components/table/src/store/watcher.ts @@ -1,7 +1,7 @@ // @ts-nocheck import { getCurrentInstance, ref, toRefs, unref, watch } from 'vue' import { isEqual } from 'lodash-unified' -import { hasOwn, isUndefined } from '@element-plus/utils' +import { hasOwn, isArray, isUndefined } from '@element-plus/utils' import { getColumnById, getColumnByKey, @@ -359,7 +359,7 @@ function useWatcher() { // 过滤与排序 const updateFilters = (columns, values) => { - if (!Array.isArray(columns)) { + if (!isArray(columns)) { columns = [columns] } const filters_ = {} @@ -430,7 +430,7 @@ function useWatcher() { columnKeys = [columnKeys] } - if (Array.isArray(columnKeys)) { + if (isArray(columnKeys)) { const columns_ = columnKeys.map((key) => getColumnByKey( { diff --git a/packages/components/table/src/table-body/styles-helper.ts b/packages/components/table/src/table-body/styles-helper.ts index 1313c27d11..6c1ab99cb0 100644 --- a/packages/components/table/src/table-body/styles-helper.ts +++ b/packages/components/table/src/table-body/styles-helper.ts @@ -1,6 +1,7 @@ // @ts-nocheck import { inject } from 'vue' import { useNamespace } from '@element-plus/hooks' +import { isArray } from '@element-plus/utils' import { ensurePosition, getFixedColumnOffset, @@ -125,7 +126,7 @@ function useStyles(props: Partial>) { rowIndex, columnIndex, }) - if (Array.isArray(result)) { + if (isArray(result)) { rowspan = result[0] colspan = result[1] } else if (typeof result === 'object') { diff --git a/packages/components/table/src/table-column/index.ts b/packages/components/table/src/table-column/index.ts index f868820712..391ed5abcd 100644 --- a/packages/components/table/src/table-column/index.ts +++ b/packages/components/table/src/table-column/index.ts @@ -11,7 +11,7 @@ import { ref, } from 'vue' import ElCheckbox from '@element-plus/components/checkbox' -import { isString, isUndefined } from '@element-plus/utils' +import { isArray, isString, isUndefined } from '@element-plus/utils' import { cellStarts } from '../config' import { compose, mergeOptions } from '../util' import useWatcher from './watcher-helper' @@ -174,7 +174,7 @@ export default defineComponent({ $index: -1, }) const children = [] - if (Array.isArray(renderDefault)) { + if (isArray(renderDefault)) { for (const childNode of renderDefault) { if ( childNode.type?.name === 'ElTableColumn' || @@ -183,7 +183,7 @@ export default defineComponent({ children.push(childNode) } else if ( childNode.type === Fragment && - Array.isArray(childNode.children) + isArray(childNode.children) ) { childNode.children.forEach((vnode) => { // No rendering when vnode is dynamic slot or text diff --git a/packages/components/table/src/table-column/render-helper.ts b/packages/components/table/src/table-column/render-helper.ts index 96e2f33e98..3cbf2dca70 100644 --- a/packages/components/table/src/table-column/render-helper.ts +++ b/packages/components/table/src/table-column/render-helper.ts @@ -9,7 +9,7 @@ import { unref, watchEffect, } from 'vue' -import { debugWarn } from '@element-plus/utils' +import { debugWarn, isArray } from '@element-plus/utils' import { useNamespace } from '@element-plus/hooks' import { cellForced, @@ -98,7 +98,7 @@ function useRender( } const checkSubColumn = (children: TableColumn | TableColumn[]) => { - if (Array.isArray(children)) { + if (isArray(children)) { children.forEach((child) => check(child)) } else { check(children) @@ -186,7 +186,7 @@ function useRender( } const getPropsData = (...propsKey: unknown[]) => { return propsKey.reduce((prev, cur) => { - if (Array.isArray(cur)) { + if (isArray(cur)) { cur.forEach((key) => { prev[key] = props[key] }) diff --git a/packages/components/table/src/util.ts b/packages/components/table/src/util.ts index b68e21f9f4..ef40fc576a 100644 --- a/packages/components/table/src/util.ts +++ b/packages/components/table/src/util.ts @@ -49,7 +49,7 @@ export const orderBy = function ( if ( !sortKey && !sortMethod && - (!sortBy || (Array.isArray(sortBy) && !sortBy.length)) + (!sortBy || (isArray(sortBy) && !sortBy.length)) ) { return array } @@ -62,7 +62,7 @@ export const orderBy = function ( ? null : function (value, index) { if (sortBy) { - if (!Array.isArray(sortBy)) { + if (!isArray(sortBy)) { sortBy = [sortBy] } return sortBy.map((by) => { @@ -332,7 +332,7 @@ export function walkTreeNode( childrenKey = 'children', lazyKey = 'hasChildren' ) { - const isNil = (array) => !(Array.isArray(array) && array.length) + const isNil = (array) => !(isArray(array) && array.length) function _walker(parent, children, level) { cb(parent, children, level) diff --git a/packages/components/tree-select/src/utils.ts b/packages/components/tree-select/src/utils.ts index 3575a38adc..f748773a9f 100644 --- a/packages/components/tree-select/src/utils.ts +++ b/packages/components/tree-select/src/utils.ts @@ -1,3 +1,5 @@ +import { isArray } from '@element-plus/utils' + import type { TreeNodeData } from '@element-plus/components/tree/src/tree.type' export function isValidValue(val: any) { @@ -5,11 +7,11 @@ export function isValidValue(val: any) { } export function isValidArray(val: any) { - return Array.isArray(val) && val.length + return isArray(val) && val.length } export function toValidArray(val: any) { - return Array.isArray(val) ? val : isValidValue(val) ? [val] : [] + return isArray(val) ? val : isValidValue(val) ? [val] : [] } type TreeCallback = ( diff --git a/packages/components/tree/src/model/node.ts b/packages/components/tree/src/model/node.ts index d566f068dc..0f959c8306 100644 --- a/packages/components/tree/src/model/node.ts +++ b/packages/components/tree/src/model/node.ts @@ -1,6 +1,6 @@ // @ts-nocheck import { reactive } from 'vue' -import { hasOwn } from '@element-plus/utils' +import { hasOwn, isArray } from '@element-plus/utils' import { NODE_KEY, markNodeData } from './util' import type TreeStore from './tree-store' @@ -153,7 +153,7 @@ class Node { ) { this.expand() } - if (!Array.isArray(this.data)) { + if (!isArray(this.data)) { markNodeData(this, this.data) } if (!this.data) return @@ -184,7 +184,7 @@ class Node { } setData(data: TreeNodeData): void { - if (!Array.isArray(data)) { + if (!isArray(data)) { markNodeData(this, data) } @@ -192,7 +192,7 @@ class Node { this.childNodes = [] let children - if (this.level === 0 && Array.isArray(this.data)) { + if (this.level === 0 && isArray(this.data)) { children = this.data } else { children = getPropertyFromData(this, 'children') || [] @@ -355,7 +355,7 @@ class Node { if (this.shouldLoadData()) { this.loadData((data) => { - if (Array.isArray(data)) { + if (isArray(data)) { if (this.checked) { this.setChecked(true, true) } else if (!this.store.checkStrictly) { diff --git a/packages/components/watermark/src/useClips.ts b/packages/components/watermark/src/useClips.ts index b305f14779..beb3af7df1 100644 --- a/packages/components/watermark/src/useClips.ts +++ b/packages/components/watermark/src/useClips.ts @@ -1,3 +1,5 @@ +import { isArray } from '@element-plus/utils' + import type { WatermarkProps } from './watermark' export const FontGap = 3 @@ -66,7 +68,7 @@ export default function useClips() { ctx.fillStyle = color ctx.textAlign = textAlign ctx.textBaseline = textBaseline - const contents = Array.isArray(content) ? content : [content] + const contents = isArray(content) ? content : [content] contents?.forEach((item, index) => { ctx.fillText( item ?? '', diff --git a/packages/components/watermark/src/watermark.vue b/packages/components/watermark/src/watermark.vue index e4f8cbf512..7970786e2f 100644 --- a/packages/components/watermark/src/watermark.vue +++ b/packages/components/watermark/src/watermark.vue @@ -14,6 +14,7 @@ import { watch, } from 'vue' import { useMutationObserver } from '@vueuse/core' +import { isArray } from '@element-plus/utils' import { watermarkProps } from './watermark' import { getPixelRatio, getStyleStr, reRendering } from './utils' import useClips, { FontGap } from './useClips' @@ -116,7 +117,7 @@ const getMarkSize = (ctx: CanvasRenderingContext2D) => { const height = props.height if (!image && ctx.measureText) { ctx.font = `${Number(fontSize.value)}px ${fontFamily.value}` - const contents = Array.isArray(content) ? content : [content] + const contents = isArray(content) ? content : [content] const sizes = contents.map((item) => { const metrics = ctx.measureText(item!) diff --git a/packages/directives/click-outside/index.ts b/packages/directives/click-outside/index.ts index a9a78f7f10..6b76a1b18b 100644 --- a/packages/directives/click-outside/index.ts +++ b/packages/directives/click-outside/index.ts @@ -1,4 +1,4 @@ -import { isClient, isElement } from '@element-plus/utils' +import { isArray, isClient, isElement } from '@element-plus/utils' import type { ComponentPublicInstance, @@ -37,7 +37,7 @@ function createDocumentHandler( binding: DirectiveBinding ): DocumentHandler { let excludes: HTMLElement[] = [] - if (Array.isArray(binding.arg)) { + if (isArray(binding.arg)) { excludes = binding.arg } else if (isElement(binding.arg)) { // due to current implementation on binding type is wrong the type casting is necessary here diff --git a/packages/utils/arrays.ts b/packages/utils/arrays.ts index 78a8f00285..2ac38289e5 100644 --- a/packages/utils/arrays.ts +++ b/packages/utils/arrays.ts @@ -1,3 +1,5 @@ +import { isArray } from './types' + export const unique = (arr: T[]) => [...new Set(arr)] type Many = T | ReadonlyArray @@ -5,7 +7,7 @@ type Many = T | ReadonlyArray /** like `_.castArray`, except falsy value returns empty array. */ export const castArray = (arr: Many): T[] => { if (!arr && (arr as any) !== 0) return [] - return Array.isArray(arr) ? arr : [arr] + return isArray(arr) ? arr : [arr] } // TODO: remove import alias diff --git a/packages/utils/vue/vnode.ts b/packages/utils/vue/vnode.ts index 001ec368f1..f5742afcde 100644 --- a/packages/utils/vue/vnode.ts +++ b/packages/utils/vue/vnode.ts @@ -97,7 +97,7 @@ export const getFirstValidNode = ( nodes: VNodeNormalizedChildren, maxDepth = 3 ) => { - if (Array.isArray(nodes)) { + if (isArray(nodes)) { return getChildren(nodes[0], maxDepth) } else { return getChildren(nodes, maxDepth)