post get 给后端传参数

news2025/3/7 0:01:36

post

方式一  : data: params
作为请求体(Request Body)传递:
你已经展示了这种方式,通过data字段直接传递一个对象或数组。这种方式通常用于传递复杂的数据结构。

  
  dowmfrom: function (params) { 
        return request({ 
          url: "/admissionInfo/admissionDataDowload", 
          method: "post", 
          data: params, // 直接发送数组作为请求体
          responseType: 'blob', 
        }); 
      },
方式二 : params: params
通过URL参数传递:
这种方式适用于传递简单的键值对数据,通常用于GET请求,但在某些情况下POST请求也可能使用这种方式(尽管不推荐,因为它不如请求体安全)。
如果你的request函数支持将参数附加到URL(通常是通过params或query字段),你可以这样修改:


dowmfrom: function (params) { 
    return request({ 
        url: "/admissionInfo/admissionDataDowload", 
        method: "post", 
        params: params, // 注意这里使用了params而不是data
        responseType: 'blob', 
    }); 
},
方式三: data: formData
通过表单数据(Form Data)传递:
这种方式常用于需要上传文件或发送大量表单字段的情况。你可以使用FormData对象来构建表单数据。


dowmfrom: function (formData) { // 注意这里formData应该是一个FormData对象
    return request({ 
        url: "/admissionInfo/admissionDataDowload", 
        method: "post", 
        data: formData, 
        headers: {
            'Content-Type': 'multipart/form-data' // 通常不需要手动设置,因为axios会自动设置
        },
        responseType: 'blob', 
    }); 
},
方式四: data: params
通过请求头(Headers)传递:
这种方式不常见,通常用于传递认证令牌或其他元数据。数据本身不会放在请求头中,但可以在请求头中包含一些必要的标识符。

dowmfrom: function (token, params) { 
    return request({ 
        url: "/admissionInfo/admissionDataDowload", 
        method: "post", 
        data: params, 
        headers: {
            'Authorization': 'Bearer ' + token
        },
        responseType: 'blob', 
    }); 
},

get 

方式一  :  params: params
   dowmfrom: function (params) { 
        return request({ 
          url: "/admissionInfo/admissionDataDowload", 
          method: "get", 
          params: params,  // 直接发送数组作为请求体
          responseType: 'blob', 
        }); 
      },

方式二:   const url = constructUrl("/admissionInfo/admissionDataDowload", params);
直接构造URL:
如果你不想依赖客户端库自动处理参数,你可以手动构造完整的URL,包括查询字符串。然后,你可以将这个完整的URL传递给请求函数。


function constructUrl(baseUrl, params) {
    const queryString = new URLSearchParams(params).toString();
    return `${baseUrl}?${queryString}`;
}
 
dowmfrom: function (params) {
    const url = constructUrl("/admissionInfo/admissionDataDowload", params);
    return request({
        url: url,
        method: "get",
        responseType: 'blob',
    });
},
 方式三:/admissionInfo/admissionDataDowload?param1=${param1}&param2=${param2}`,
传递单个参数:
如果你的GET请求只需要传递一个或少数几个参数,你也可以直接在URL模板字符串中插入这些参数。但是,这种方法在处理多个参数或参数值包含特殊字符时不太方便。



dowmfrom: function (param1, param2) {
    return request({
        url: `/admissionInfo/admissionDataDowload?param1=${param1}&param2=${param2}`,
        method: "get",
        responseType: 'blob',
    });
},
方式四: params:  { id: id },
   webfielddel: function (id) {
        return request({
            url: "tableManage/del",
            method: "get",
            params:  { id: id },
        });
    },


页面使用的方式

方式一:
    dowmfrom: function (params) { 
        return request({ 
          url: "/admissionInfo/admissionDataDowload", 
          method: "post", 
          data: params, // 直接发送数组作为请求体
          responseType: 'blob', 
        }); 
      },
       



  downloadTemplate() {
      // 将 this.selectList 中的每个项目转换为字符串的数组
      const dowmids = this.selectList.map(item => item.toString());

      const dowm = JSON.parse(JSON.stringify(dowmids))

      // 调用 API 函数并直接传递数组
      allApi.dowmfrom(dowm)
        .then((res) => {
          console.log(res, '111');
          // 根据需要处理响应
        })
        .catch(err => {
          console.error('Error downloading template:', err);
        });
}

 
因为后端要  ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"]   所以我们只传  dowm 就可以
 方式二:
    webfieldinit: function (params) {
        return request({
            url: "tableManage/getByOffice",
            method: "get",
            params: params,
        });
    },
  



 refreshList() {
            this.newtype = JSON.parse(this.value3)
          
            const params = {
                officeId: this.companyDTO,
                type: this.newtype,
            };
            webfield.webfieldinit(params).then((data) => {
                this.dataList = JSON.parse(data.data.content)
                
            }).catch((error) => {
                console.error('Error fetching data:', error);
                this.loading = false;
            });
        },
方式三:
    webfielddel: function (id) {
        return request({
            url: "tableManage/del",
            method: "get",
            params:  { id: id },
        });
    },

  webfield.webfielddel(this.ids).then((data) => {
                    console.log(data)
         
                }).catch((error) => {
                    console.error('Error fetching data:', error);
                
                });


   //、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、
    // // 还原数据
        // restoration() {
        //     this.loading = true;
        //     console.log(this.loading, 'loading'); // 修正了拼写错误,从 'loda' 改为 'loading'

        //     if (this.ids === '' || this.ids === undefined || this.ids === null) {
        //         console.log('kong ')
        //         alert('已经还原成最初的原始数据了!');
        //         this.loading = false; // 如果不需要刷新页面,可以在这里直接设置 loading 为 false
        //     } else {
        //         console.log(this.ids, 'konglllll ')
        //         webfield.webfielddel(this.ids).then((data) => {
        //             console.log(data)
        //             this.assignDataToArrays();
        //             location.reload(true); // 仅在数据删除成功后刷新页面
        //         }).catch((error) => {
        //             console.error('Error fetching data:', error);
        //             this.loading = false; // 请求失败时设置 loading 为 false
        //         });
        //     }
        // }

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2310766.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Hive-08之数据仓库之建模、分析

一、目标 掌握数据仓库基本概念熟悉数据仓库的模型建立 二、知识要点 1. 数据仓库基本介绍 英文名称为Data Warehouse,可简写为DW或DWH。数据仓库的目的是构建面向分析的集成化数据环境,为企业提供决策支持(Decision Support)…

仿12306项目(4)

基本预定车票功能的开发 对于乘客购票来说,需要有每一个车次的余票信息,展示给乘客,供乘客选择,因此首个功能是余票的初始化,之后是余票查询,这两个都是控台端。对于会员端的购票,需要有余票查询…

MySQL零基础教程16—表连接进阶

复习表别名 之前已经学习过,查询的时候可以使用as来对检索的列进行重命名,这样可以让sql更加简介,增强易读性(as可以省略) 此外,使用表别名还可以支持在一条select语句中,一个表是被多次使用 …

【JavaSE-3】运算符

1、什么是运算符 就是对常量或者变量进行操作的符号,如:,-,*,/ 表达式: 用运算符把常量或者变量连接起来的,符合java语法的式子就是表达式。 2、 算术运算符 2.1、基本四则运算符 - * / % 都…

直接法估计相机位姿

引入 在前面的文章:运动跟踪——Lucas-Kanade光流中,我们了解到特征点法存在一些缺陷,并且用光流法追踪像素点的运动来替代特征点法进行特征点匹配的过程来解决这些缺陷。而这篇文章要介绍的直接法则是通过计算特征点在下一时刻图像中的位置…

VS2022C#windows窗体应用程序调用DeepSeek API

目录 一、创建DeepSeek API Key 二、创建窗体应用程序 三、设计窗体 1、控件拖放布局‌‌ 2、主窗体【Form1】设计 3、多行文本框【tbContent】 4、提交按钮【btnSubmit】 5、单行文字框 四、撰写程序 五、完整代码 六、运行效果 七、其它 一、创建DeepSeek API Ke…

kettle插件-高性能插入更新插件Upsert

场景:假如T日需要将a表中T-1日的数据同步到b表。由于某种业务需求a表中已经同步到b表中的数据发生了变化需要重新同步,这个时候就会用到插入更新插件,也就是 说a表中数据重新同步b表,若b表中存在此数据(根据唯一id&am…

本地部署Qwen2.5-VL-7B-Instruct模型

本地部署Qwen2.5-VL-7B-Instruct模型 本地部署Permalink **创建环境** conda create -n qwenvl python3.11 -y# 报错: Solving environment: failedPackagesNotFoundError: The following packages are not available from current channels:# 处理: c…

【C++学习篇】智能指针

目录 1. 智能指针的使用场景分析 2. RAII和智能指针的设计思路 3. C标准库智能指针的使用 4.shared_ptr和weak_ptr 4.1shared_ptr的循环引用问题 4.2 weak_ptr 1. 智能指针的使用场景分析 下⾯程序中我们可以看到,new了以后,我们也delete了&#xff0c…

决策树(Decision Tree)基础知识

目录 一、回忆1、*机器学习的三要素:1)*函数族2)*目标函数2.1)*模型的其他复杂度参数 3)*优化算法 2、*前处理/后处理1)前处理:特征工程2)后处理:模型选择和模型评估 3、…

Excel基础(详细篇):总结易忽视的知识点,有用的细节操作

目录 写在前面基础篇Excel主要功能必会快捷键快捷键整理表LotusExcel的文件类型工作表基本操作表项操作选中与缩放边框线 自动添加边框线格式刷设置斜线表头双/多斜线表头不变形的:双/多斜线表头插入多行、多列单元格/行列的移动冻结窗口 方便查看数据打印的常见问题Excel格式…

Linux下学【MySQL】中如何实现:多表查询(配sql+实操图+案例巩固 通俗易懂版~)

每日激励:“不设限和自我肯定的心态:I can do all things。 — Stephen Curry” 绪论: 本章是MySQL篇中,非常实用性的篇章,相信在实际工作中对于表的查询,很多时候会涉及多表的查询,在多表查询的…

非平稳时间序列分析(三)——季节模型(SARIMA、STL、Holt-Winters)

此前篇章(平稳序列): 时间序列分析(一)——基础概念篇 时间序列分析(二)——平稳性检验 时间序列分析(三)——白噪声检验 时间序列分析(四)—…

【web前端开发】CSS--CSS简介及其编写位置(上)

1、CSS简介 (1)CSS的全称为:层叠式样式表(Cascading Style Sheets) (2)CSS也是一种标记语言,用于给HTML结构设置样式,例如:文字大小、颜色、元素宽度等等…

云原生时代的技术桥梁

在数字化转型的大潮中,企业面临着数据孤岛、应用间集成复杂、高成本与低效率等问题。这些问题不仅阻碍了企业内部信息的流通和资源的共享,也影响了企业对外部市场变化的响应速度。当前,这一转型过程从IT角度来看,已然迈入云原生时…

【数据结构】什么是栈||栈的经典应用||分治递归||斐波那契问题和归并算法||递归实现||顺序栈和链栈的区分

文章目录 🥧栈的初步理解:🥧易错:如何判断栈满🥧栈满理解🥧栈的基本运算📚栈操作的伪代码逻辑(顺序和链栈)📕顺序栈运算实现:顺序栈的表示&#x…

雷池WAF的为什么选择基于Docker

Docker 是一种开源的容器化平台,可以帮助开发人员将应用程序及其所有依赖项打包到一个称为容器的独立、可移植的环境中。Docker 的核心概念包括以下几点: 容器:Docker 使用容器来封装应用程序及其依赖项,使其能够在任何环境中都能…

Ubuntu20.04双系统安装及软件安装(七):Anaconda3

Ubuntu20.04双系统安装及软件安装(七):Anaconda3 打开Anaconda官网,在右侧处填写邮箱(要真实有效!),然后Submit。会出现如图示的Success界面。 进入填写的邮箱,有一封Ana…

文件上传漏洞:upload-labs靶场11-20

目录 pass-11 pass-12 pass-13 pass-14 pass-15 pass-16 pass-17 pass-18 pass-19 pass-20 pass-11 分析源代码 ,发现上传文件的存放路径可控 if(isset($_POST[submit])){$ext_arr array(jpg,png,gif);$file_ext substr($_FILES[upload_file][name],st…

HTTP协议(20250305)

1. 万维网 WWW(World Wide Web)世界范围内的,联机式的信息储藏所,万维网解决了获取互联网上的数据时需要解决的以下问题: 怎样标识分布在整个互联网上的文档 URL用什么样的协议实现万维网上的各种链接 HTTP怎么使用户能够方便的查看文档数…