vue3开发,axios发送请求是携带params参数的避坑

vue3开发,axios发送请求是携带params参数的避坑!今天一直报错,点击新增购物车,报错,

【Uncaught (in promise) TypeError: target must be an object】。查询了网上的资料说的都不对。都没有解决。最终还是被我整明白了。


网上网友说的是,axios的引用方式,vue3的改变了。必须是配置一下才能用。

app.config.globalProperties.$http = axios

如图所示,是用了这个配置参数来完成了axios的使用。

不能用app.use(axios)。这样是错误的。


复制代码
/**
 * 加入购物车
 */
export function addOneOrders(id){
    return httpInstance({
        url:'/order/addOneOrder?',
        params:{
            id:id
        }
    })
}

这个代码是,修正后的,参数格式。用一个json对象去给接口传递参数。id.

之前我写的是,

params:id。这样写的。不知道为什么昨天是正常的。今天忽然就不行了。

改成json对象的格式传递过去,一切恢复了正常。

接口路径后面,不需要带任何的符号。问号是不需要的。因为有了json对象,它会自动帮你映射到接口里面的参数,只需要您保证参数名字,和json里面的属性名字一致就行了。省心了。


如图,我新增了三条购物车的信息,是正常的。说明改成json对象作为参数传给后端使用,是正确的。

相关推荐
禅思院13 分钟前
AI对话前端从入门到崩溃:一个长对话引发的五层优化战争【引子】
前端·面试·架构
TrisighT40 分钟前
Electron 鸿蒙 PC 上点外链唤醒应用,我试了 6 种写法只有 1 种能跑
前端·electron·harmonyos
天才熊猫君2 小时前
配置与数据分离:一种可视化搭建的属性编辑方案
前端·javascript
林希_Rachel_傻希希2 小时前
web性能之相关路径——AI总结
前端·javascript·面试
不好听6132 小时前
从零搭建一个 RAG 语义搜索系统 —— DEMO的初始阶段
javascript·面试·llm
何时梦醒2 小时前
上下文工程(Context Engineering):AI 应用开发的新范式 —— 从理论到实战全解析
javascript
竹林8182 小时前
用 wagmi v2 踩坑两天,我终于搞懂了多链钱包切换在 DeFi 前端中的正确姿势
前端·javascript
用户2136610035722 小时前
Vue项目搜索功能与面包屑导航
前端·javascript
星栈2 小时前
LiveView 的实时通信,爽是爽,但 PubSub 和广播也最容易把自己绕晕
前端·前端框架·elixir
用户2930750976692 小时前
告别关键词匹配,拥抱向量语义 —— RAG 搜索从零到一
前端