随笔分类 -  vue / hooks

摘要:项目环境 Vue3.x + Ant Design Vue3.x + Vite4.x 业务场景分析 图文内容仅供参考,仅提供文章内所需思考对应的图例 在以上图片中,是管理后台系统中常见的表格内容,因使用的是 Ant Design Vue 框架,根据官方的文档中所示: Column 的 API elli 阅读全文
posted @ 2024-01-04 14:51 柯基与佩奇 阅读(105) 评论(0) 推荐(0) 编辑
摘要:项目环境 Vue3.x + Ant Design Vue3.x + Vite3.x 封装思考:为什么封装 useTableRowSelection.js 首先, 基于 Hooks(useTableData.js、useQueryParams.js)的封装,作为管理后台表格常见操作的批量删除、批量编辑 阅读全文
posted @ 2024-01-04 14:50 柯基与佩奇 阅读(125) 评论(0) 推荐(0) 编辑
摘要:项目环境 Vue3.x + Ant Design Vue3.x + Vite3.x 封装思考:何为自定义表格数据列渲染,其为何种场景服务 根据实际业务场景而来,为避免法律风险,部分截图内容脱敏处理 如下图,当表格内容的列非常多时,正常情况下,我们通常采取的方式是左右两侧的列,即左侧 Key 列和右侧 阅读全文
posted @ 2024-01-04 14:49 柯基与佩奇 阅读(102) 评论(0) 推荐(0) 编辑
摘要:项目环境 Vue3.x + Ant Design Vue3.x + Vite3.x 封装分解:创建 a 标签下载文件 export function createDownload(blob, fileName, fileType) { if (!blob || !fileName || !fileT 阅读全文
posted @ 2024-01-04 14:48 柯基与佩奇 阅读(37) 评论(0) 推荐(0) 编辑
摘要:项目环境 Vue3.x + Ant Design Vue3.x + Vite3.x 此篇内容讲解的是关于公共 Hooks 封装之表格数据 useTableData 中暴露出来与 queryParams 的一些方法,而进行封装的 Hooks,其目的在于减少冗余重复代码的书写。 封装分解:参数定义 co 阅读全文
posted @ 2024-01-04 14:44 柯基与佩奇 阅读(121) 评论(0) 推荐(0) 编辑
摘要:项目环境 Vue3.x + Ant Design Vue3.x + Vite3.x 封装分解:声明变量 import { ref, shallowRef, isRef } from "vue"; const loading = ref(false); // 表格数据UI交互Loading const 阅读全文
posted @ 2024-01-04 14:43 柯基与佩奇 阅读(104) 评论(0) 推荐(0) 编辑
摘要:写在前面 对于经常需要开发企业管理后台的前端开发来说,必不可少的需要使用表格对于数据进行操作,在对于现有项目进行代码优化时,封装一些公共的 Hooks. 本篇文章为useExportExcel.js 基于个人项目环境进行封装的 Hooks,仅以本文介绍封装 Hooks 思想心得,故相关代码可能不适用 阅读全文
posted @ 2024-01-04 14:40 柯基与佩奇 阅读(25) 评论(0) 推荐(0) 编辑
摘要:写在前面 对于经常需要开发企业管理后台的前端开发来说,必不可少的需要使用表格对于数据进行操作,在对于现有项目进行代码优化时,封装一些公共的 Hooks. 本篇文章为useDownloadFile.js 基于个人项目环境进行封装的 Hooks,仅以本文介绍封装 Hooks 思想心得,故相关代码可能不适 阅读全文
posted @ 2024-01-04 14:38 柯基与佩奇 阅读(28) 评论(0) 推荐(0) 编辑

欢迎阅读『hooks』
点击右上角即可分享
微信分享提示