vue-springboot 前后端传参的形式

序言：

简单来说，qs 是一个增加了一些安全性的查询字符串解析和序列化字符串的库。

在项目中使用命令行工具输入：npm install qs --save--dev
安装完成后在需要用到的组件中：import qs from 'qs’
具体使用中我查看了：qs.parse()和qs.stringify()

这两种方法虽然都是序列化，但是还是有区别的。
qs.parse()是将URL解析成对象的形式
qs.stringify()是将对象 序列化成URL的形式，以&进行拼接

1.post传参

web端使用：

js:post方法

import axios from "@/utils/axios";
import * as qs from "qs"

export function updateReadStatus(accountId:string,articleId:string) {
    return axios.post('/weChat/read/update?'+qs.stringify({"accountId":accountId,"articleId":articleId}))
}

---

使用：

const onJumpJd = async (detailsUrl: string, accountId: string, articleId: string) => {
  //跟新基地状态
  await updateReadStatus(accountId, articleId)
  await getJddt()
  window.location.href = detailsUrl
}

这种在后端接受的时候不是对象传参：

例如这种：

@PostMapping("/weChat/read/update")

public static void updateReadStatus(string accountId,string articleId){

//业务

}

2.get传参

js业务代码
不带参数的：
export function getJddtMenu() {
    return axios.get('/weChat/listArticles')
}

使用：

const jddtLst = ref<any>([])
const getJddt = () => {
  return new Promise((resolve, reject) => {
    getJddtMenu().then(res => {
      console.log(res);
      jddtLst.value = setArrayBlock(res.data, 3)
      resolve(1)
    })
  })
}

带参数的：

export function getMemberInfo(xgh: string) {
    return axios.get('/creation/getMemberInfo/' + xgh)
}

getMemberInfo(formContent.authorXgh).then((res: any) => {
  formContent.department = res.data.yxsh}