vue3 基于elementui el-table封装 hooks （未使用ts版本）

原创

已于 2024-07-31 16:43:53 修改 · 592 阅读

标签

#vue.js #javascript #前端

收录于

于 2024-07-31 16:41:30 首次发布

elementui-table封装 hooks

js-hooks

import { ref, reactive, onMounted } from 'vue'
import { ElMessage, ElMessageBox, ElNotification } from 'element-plus'
/**
 * @FileDescription: el-table 函数式组件hooks--实现一个表格的数据加载、分页、搜索、删除和导出等操作,
 * @function:useTable(config)
 * @param {object} config useTable(配置项)
 * @param {function} config.loadDataFunc 分页列表接口函数
 * @param {object} config.queryForm 表单配置
 * @param {function} config.deleteDataFunc 删除接口函数
 * @param {object} config.options 内部函数配置项(分页 | 接口配置)
 * @param {boolean} config.options.immediate 是否默认执行
 * @param {object} config.options.pageSizeConfig 分页字段配置
 * @param {string} config.options.pageSizeConfig.table_page 页数
 * @param {string} config.options.pageSizeConfig.table_size 页码
 * @param {string} config.options.pageSizeConfig.table_pageNum 默认页数
 * @param {string} config.options.pageSizeConfig.table_sizeNum 默认页码
 * @param {object} config.options.apiConfig 列表接口返回值配置
 * @param {string} config.options.a