前端通用工具函数

前端通用工具函数提供了一系列常用的功能,包括文本复制、时间格式化、参数获取等,帮助开发者更高效地完成日常开发任务。

复制文本到剪贴板

使用 copyText 函数可以快速复制文本内容到剪贴板。

使用示例

import { commonFunction } from '/@/utils/commonFunction';

const { copyText } = commonFunction();
<button @click="copyText('文案内容')">复制</button>
用户体验

复制成功后会自动显示提示消息,提升用户体验。

格式化时间

提供了 parseDateparseTime 两个时间格式化函数,支持在模板和脚本中使用。

在模板中直接使用

模板中可以直接使用 parseDateparseTime 进行格式化:

<el-table-column
  :label="t('tenant.startTime')"
  prop="startTime"
  show-overflow-tooltip
>
  <template #default="scope">
    <span>{{ parseDate(scope.row.startTime) }}</span>
  </template>
</el-table-column>

<el-table-column
  :label="t('tenant.endTime')"
  prop="endTime"
  show-overflow-tooltip
>
  <template #default="scope">
    <span>{{ parseTime(scope.row.endTime) }}</span>
  </template>
</el-table-column>

在 TypeScript 中使用

在 TypeScript 代码中需要手动导入:

import { formatDate, parseDate } from '/@/utils/formatTime';
函数选择

parseDate 用于格式化日期(年-月-日),parseTime 用于格式化完整时间(年-月-日 时:分:秒)。根据实际需求选择合适的函数。

获取后端参数

通过 params 工具可以动态获取后端配置的参数值。

使用示例

import params from '/@/utils/params';

let result = await params.get('参数管理中的KEY');
异步操作

params.get() 是异步方法,需要使用 await.then() 处理返回值。