在之前了解axios时,在进行传参时无论如何只能使用地址栏附带参数,但实际上我使用的并非GET,而是POST等方式。
btn.onclick = () => {
console.log(111)
axios.post('./1.php', {
name: 'axios',
age: 18
})
};
我先后百度了不少资料,大多数解决办法是使用qs库,npm里面自带的,但是给出的一般都是使用node安装(当时没想到去找qs的cdn,又或者说是没找到?上周的事情,忘了。)
至于为什么我要用那个qs库,这是因为用上面展示那个代码传参,它的参数会存在浏览器的Request Payload里面。在PHP(目前学习的是php)里用get或者post都获取不到这个参数。而当写成如下形式——
btn.onclick = () => {
console.log(111)
axios({
method: 'post',
url: './1.php',
data: {
firstName: 'clear'
}
})
};
// 官方文档
// `data` 是作为请求主体被发送的数据
// 只适用于这些请求方法 'PUT', 'POST', 和 'PATCH'
// 在没有设置 `transformRequest` 时,必须是以下类型之一:
// - string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams
// - 浏览器专属:FormData, File, Blob
// - Node 专属: Stream
data: {
firstName: 'Fred'
},
当时我有一个疑惑,明明官方文档也是这么说的要用data来标明,为什么传递不了呢?我这也明明是一个普通对象(plain object),用字符串的话,那就和get地址栏拼接没什么区别。
首先是:https://segmentfault.com/a/1190000018774494
A_大白的博客,解决了我对于formData和Request Payload的区别的疑惑。
其次是今天意外点开的一个博客:https://blog.csdn.net/example440982/article/details/89927349?utm_medium=distribute.pc_relevant.none-task-blog-2defaultbaidujs_baidulandingword~default-0.no_search_link&spm=1001.2101.3001.4242.1
按照今天的课程,本来是学习node.js,那么我用npm install qs 安装qs模块也成功了,那肯定也能用了,结果没想到还是失败了,阴差阳错就点到了这个博客,使用在线cdn引入qs,于是
let qs = Qs
btn.onclick = () => {
console.log(111)
axios.post('./1.php', qs.stringify({
name: 'zs',
age: 19
}))
};
诶,成功挂到Form Data下了!再换个姿势:
btn.onclick = () => {
console.log(111)
axios({
method: 'post',
url: './1.php',
data: qs.stringify({
name: 'zs',
age: 18
})
})
};
都成了!
按照大佬的话来说,这叫做**普通html页面使用[axios] post数据需要处理提交的数据,一般用到qs库
**
网友评论