vue3如何运用组合式写法,封装表格列表请求数据的逻辑

devtools/2024/10/22 12:08:39/

1.代码如下:

javascript">import { getPageList } from "@/api/cloudExhibitionHall"
import { ref, watch } from "vue"// 特殊参数传参
const role = JSON.parse(localStorage.getItem('current-role') || '{}')
const tenantId = role.tenantId ? role.tenantId : 6const defaultParams = { // 重置选项pageNum: 1,pageSize: 10,tenantId
}export function useGetTableList(params = {}) {defaultParams.pageSize = params.pageSizeconst searchParams = ref({ ...defaultParams, ...params })const pageTotal = ref(0)const tableData = ref([])watch([searchParams], () => {initData()}, { immediate: true, deep: true }) // 进入列表页面,立刻请求function handleSearch(data, type) {if (type == 'reset') {searchParams.value = defaultParams} else {searchParams.value = { ...searchParams.value, ...data }}}async function initData() {const { data = {}, code } = await getPageList({ ...searchParams.value })if (code == 200) {tableData.value = data?.list || []pageTotal.value = data?.total}}return {searchParams,pageTotal,tableData,handleSearch,initData}
}

http://www.ppmy.cn/devtools/127830.html

相关文章

Java Spring的常用注解详解和案例示范

1. Spring 常用注解概述 1.1 Component Component 是 Spring 的基础注解之一,它用于将类标记为 Spring 容器中的一个组件。通过 Component 注解,Spring 会自动将该类注册为一个 Bean,供依赖注入使用。 使用示例: Component pu…

Vue 路由

前端路由&#xff1a; URL 中的 hash(#号) 与组件之间的对应关系。 1. Vue 路由 1.1 Vue Router 介绍: Vue Router 是 Vue 的官方路由。 组成: VueRouter: 路由器类&#xff0c;根据路由请求在路由视图中动态渲染选中的组件。 <router-link>&#xff1a;请求链接组件…

全面了解 NGINX 的负载均衡算法

NGINX 提供多种负载均衡方法&#xff0c;以应对不同的流量分发需求。常用的算法包括&#xff1a;最少连接、最短时间、通用哈希、随机算法和 IP 哈希。这些负载均衡算法都通过独立指令来定义&#xff0c;每种算法都有其独特的应用场景。 以下负载均衡方法&#xff08;IP 哈希除…

Unity3D功耗和发热分析与优化详解

前言 Unity3D作为广泛使用的游戏开发引擎&#xff0c;在游戏开发过程中&#xff0c;功耗和发热问题一直是开发者需要重点关注的问题。功耗和发热不仅影响用户体验&#xff0c;还可能对设备的硬件寿命造成一定影响。本文将从技术角度详细分析Unity3D游戏在移动设备上的功耗和发…

关于小程序审核需要提交订单列表页面path的修改办法

小程序又又又又又搞事情啦&#xff5e;&#xff5e;&#xff5e; 从12月31号起&#xff0c;所有有订单生成逻辑的小程序在审核过程中&#xff0c;必须要填写订单列表页面的path才可以进行审核 在代码层面上会有一些小的改动&#xff0c;下面就告诉大家怎么去修改吧。 第一步…

windows安装mysql,跳过自定义的密码验证

1、mysql版本8 2、配置系统环境变量 3、新建my.ini文件在mysql目录下&#xff0c;需要指定data目录 [mysqld] # 设置3306端口 port3306# 自定义设置mysql的安装目录&#xff0c;即解压mysql压缩包的目录 basedirD:\hjl\app\mysql\mysql-8.0.33-winx64# 自定义设置mysql数据…

c语言基础程序——经典100道实例。

c语言基础程序——经典100道实例 001&#xff0c; 组无重复数字的数002&#xff0c;企业发放的奖金根据利润提成003&#xff0c;完全平方数004&#xff0c;判断当天是这一年的第几天005&#xff0c;三个数由小到大输出006&#xff0c;输出字母C图案007&#xff0c;特殊图案008&…

24、darkhole_2

难度 高&#xff08;个人感觉属于中&#xff09; 目标 root权限2个flag 基于VMware启动&#xff08;我这里启动只能选择我wifi的那个网卡才能获取到ip地址&#xff0c;nat的没获取到不知道为什么。&#xff09; kali 192.168.1.122 靶机 192.168.1.170 信息收集 端口扫描 只开…