diff --git a/admin/src/hooks/usePaging.ts b/admin/src/hooks/usePaging.ts index a4ae45b..bb98ac7 100644 --- a/admin/src/hooks/usePaging.ts +++ b/admin/src/hooks/usePaging.ts @@ -9,6 +9,17 @@ interface Options { firstLoading?: boolean } +/** + * + * @param {object} options + * @param {number} options.page 页码 + * @param {number} options.size 每页条数 + * @param {function} options.fetchFun 分页接口函数 + * @param {object} options.params 分页参数 + * @param {boolean} options.firstLoading 是否首次加载 + * + * + */ export function usePaging(options: Options) { const { page = 1, size = 15, fetchFun, params = {}, firstLoading = false } = options // 记录分页初始参数 @@ -51,7 +62,8 @@ export function usePaging(options: Options) { Object.keys(paramsInit).forEach((item) => { params[item] = paramsInit[item] }) - getLists() + + resetPage() } return { pager, diff --git a/admin/src/views/flow/flow_apply/index.vue b/admin/src/views/flow/flow_apply/index.vue index 5a22a8b..4e41b9a 100644 --- a/admin/src/views/flow/flow_apply/index.vue +++ b/admin/src/views/flow/flow_apply/index.vue @@ -174,7 +174,7 @@ const queryParams = reactive({ status: '' }) -const { pager, getLists, resetPage, resetParams } = usePaging({ +const { pager, getLists, resetPage, resetParams } = usePaging({ fetchFun: flow_apply_lists, params: queryParams }) diff --git a/docs/.vitepress/config.mts b/docs/.vitepress/config.mts index a3220a1..4ed8359 100644 --- a/docs/.vitepress/config.mts +++ b/docs/.vitepress/config.mts @@ -43,6 +43,7 @@ export default defineConfig({ { text: 'nginx配置', link: '/admin/nginx配置.md' }, { text: '路由', link: '/admin/路由.md' }, + { text: '自定义hooks', link: '/admin/自定义hooks.md' }, ] } ], diff --git a/docs/admin/自定义hooks.md b/docs/admin/自定义hooks.md new file mode 100644 index 0000000..e89236f --- /dev/null +++ b/docs/admin/自定义hooks.md @@ -0,0 +1,59 @@ +# 自定义hooks + +1. 获取分页数据 usePaging + +```js +import { usePaging } from '@/hooks/usePaging' +/** + * + * @param {object} options + * @param {number} options.page 初始页码 + * @param {number} options.size 每页条数 + * @param {function} options.fetchFun 分页接口函数 + * @param {object} options.params 分页参数 + * @param {boolean} options.firstLoading 是否首次加载 + * + */ +const { pager, getLists, resetPage, resetParams } = usePaging(options) +// any为接口返回的列表数据类型 + +// pager.page 页码 +// pager.size 每页条数 +// pager.loading 是否加载中 +// pager.count 总条数 +// pager.lists 数据列表 + +// getLists() 获取数据列表 +// resetPage() 重置页码并获取数据列表 +// resetParams() 重置参数、页码并获取数据列表 + + +``` +2. 获取字典 useDictData +```js +import { useDictData } from '@/hooks/useDictOptions' +const { dictData } = useDictData<{ + flow_apply_status: any[] + flow_group: any[] +}>(['flow_apply_status', 'flow_group']) + +// 返回类型 +// dictData.flow_apply_status: any[]; +// dictData.flow_group: any[]; + +``` + +3. 获取不分页列表 useDictOptions +```ts +import { useDictOptions } from '@/hooks/useDictOptions' +const { optionsData,refresh } = useDictOptions<{ + articleCate: any[] +}>({ + articleCate: { + api: articleCateAll + } +}) + +// optionsData.articleCate: any[] 数据列表 +// refresh 刷新数据 +``` \ No newline at end of file