Element Plus Pro

深色模式

Utils 工具类 ​

NumberUtil ​

parseInt ​

将目标字符串转换为指定基数的整数

parseInt(str: string, defaultValue: number = 0, radix?: number): number

  • str: string - 要转换的字符串
  • defaultValue: number - 默认值
  • radix: number - 转换基数
vue
<script setup lang="ts">
  import { parseInt } from "@easyui/element-plus-pro";

  parseInt("");       // 0
  parseInt("", 1);    // 1
  parseInt("10");     // 10
</script>

sum ​

计算数组中值的总和

sum(list: number[], defaultValue: number = 0): number

  • list: number[] - 目标数组
  • defaultValue: number - 默认值
vue
<script setup lang="ts">
  import { sum } from "@easyui/element-plus-pro";

  sum([1, 2, 2]);     // 5
  sum([], 5);         // 5
</script>

DateUtil ​

dateFormat ​

将指定日期时间格式化为指定格式字符串

dateFormat(date: Date | string, pattern: string = "yyyy-MM-dd HH:mm:ss"): string

  • str: date: Date | string - 目标日期时间
  • pattern: string - 格式化模式 "yyyy-MM-dd HH:mm:ss"
vue
<script setup lang="ts">
  import { dateFormat } from "@easyui/element-plus-pro";

  dateFormat(new Date(), "yyyy-MM-dd HH:mm:ss");    // "2025-12-01 00:00:00"
  dateFormat("2025-12-01", "yyyy/MM/dd");           // "2025/12/01"
</script>

isToday ​

判断指定日期是否为今天

isToday(date: Date | string): boolean

  • date: Date | string - 目标日期
vue
<script setup lang="ts">
  import { isToday } from "@easyui/element-plus-pro";

  isToday(new Date());     // true
</script>

compareDates ​

判断两个指定日期间的大小关系，第一个大于第二个时返回 true，否则返回 false

compareDates(date1: Date | string, date2: Date | string, isEq: boolean = true): boolean

  • date1: Date | string - 当前日期
  • date2: Date | string - 需要判断的指定日期
  • isEq: boolean - 是否判断相等情况
vue
<script setup lang="ts">
  import { compareDates } from "@easyui/element-plus-pro";

  compareDates("2025-12-02", "2025-12-01");     // true
</script>

FileUtil ​

importFile ​

导入指定文件内容

importFile(fileAccept: string | string[], callback: ImportFileCallback): void

  • fileAccept: string | string[] - 接受的文件类型
  • callback: ImportFileCallback - 文件导入成功/失败的回调
vue
<script setup lang="ts">
  import { importFile } from "@easyui/element-plus-pro";

  importFile(".json", {
    success: (fileText: string) => {
      console.log("文件导入成功：", fileText);
    },
    failed: (error: Error) => {
      console.error("文件导入失败：", error);
    }
  });
</script>

exportFile ​

将指定内容导出为文件

exportFile(text: string, fileName: string, fileType: string = "text/json"): void

  • text: string - 导出文件内容
  • fileName: string - 导出文件名称
  • fileType: string - 导出文件类型
vue
<script setup lang="ts">
  import { exportFile } from "@easyui/element-plus-pro";

  const exportContent: string = JSON.stringify({ name: "Tom" });
  exportFile(exportContent, "user-info.json", "text/json");
</script>

ListUtil ​

uniqueList ​

根据指定字段或字段数组对列表进行去重

uniqueList<T extends Record<string, any>>(list: T[], fields: string | string[], keepLast: boolean = false): T[]

  • list: T[] - 目标列表
  • fields: string | string[] - 去重字段名或字段数组
  • keepLast: boolean = false - 保留最后一次出现值（为 false 时保留首次出现值）
vue
<script setup lang="ts">
  import { uniqueList } from "@easyui/element-plus-pro";
  
  const list: Record<string, any>[] = [
    { id: "111", username: "Tom", age: 18 },
    { id: "222", username: "Jerry", age: 24 },
    { id: "333", username: "Tom", age: 21 }
  ];
  uniqueList(list, "username");
</script>

PromiseUtil ​

isPromise ​

判断指定对象是否为 Promise 对象

isPromise(targetObj: any): boolean

  • targetObj: any - 目标对象

returnAsPromise ​

执行指定函数并将其结果作为 Promise 对象返回

returnAsPromise<T = any>(targetFunc: Function, ...params: any[]): Promise<T>

  • targetFunc: Function - 目标函数
  • params: any[] - 目标函数参数
vue
<script setup lang="ts">
  import { isPromise, returnAsPromise } from "@easyui/element-plus-pro";

  isPromise(Promise.resolve());    // true
  isPromise("aaa");                // false

  returnAsPromise(() => "aaa");    // return: Promise.resolve("aaa");
</script>

StyleUtil ​

parseClassStr ​

将 class 对象值解析为 class 字符串

parseClassStr(classObj: Record<string, boolean>): string

  • classObj: Record<string, boolean> - class 对象

parseClassObj ​

将 class 字符串值解析为 class 对象

parseClassObj(classStr: string): Record<string, boolean>

  • classStr: string - class 字符串
vue
<script setup lang="ts">
  import { parseClassStr, parseClassObj } from "@easyui/element-plus-pro";

  parseClassStr({
    "example-demo": true,
    "example-border": true
  });
  // "example-demo example-border"
  
  parseClassObj("example-demo example-border");
  // {
  //   "example-demo": true,
  //   "example-border": true
  // }
</script>

parseStyleStr ​

判断指定对象是否为 Promise 对象

parseStyleStr(styleObj: Record<string, any>): string

  • styleObj: Record<string, any> - style 对象

parseStyleObj ​

执行指定函数并将其结果作为 Promise 对象返回

parseStyleObj(styleStr: string): Record<string, any>

  • styleStr: string - style 字符串
vue
<script setup lang="ts">
  import { parseStyleStr, parseStyleObj } from "@easyui/element-plus-pro";

  parseStyleStr({
    "margin": "0 0",
    "height": "100px"
  });
  // "margin: 0 0;height: 100px;"

  parseStyleObj("margin: 0 0;height: 100px;");
  // {
  //   "margin": "0 0",
  //   "height": "100px"
  // }
</script>