vue中post数组到后端数组格式错误

问题背景：

在vue中使用post向后端发送数据，数据格式如下

{key: "test", description: "test", pages: Array(8)}
description: "test"
key: "test"
pages: Array(8)
0: "Dashbord"
1: "Permission"
2: "PageUser"
3: "PageAdmin"
4: "Roles"
5: "MonitorMain"
6: "MonitMain"
7: "HostManage"
length: 8

其中post在使用axios发送时进行了拦截处理

export default {
  post(url, data) {
    return $axios({
      method: 'post',
      url,
      data: Qs.stringify(data),
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
      }
    })
  },

后端使用的是flask restful webapi
接收数据的方法如下：

@jwt_required
    def post(self):
        claims = get_jwt_claims()
        form = request.form.to_dict()
        print(form)

数据中的数组在传到后端之后变成了字典的形式：

{'key': 'test', 'description': 'tet', 'pages[0]': 'Dashbord', 
'pages[1]': 'Permission', 'pages[2]': 'PageUser', 
'pages[3]': 'PageAdmin', 'pages[4]': 'Roles',
 'pages[5]': 'MonitorMain', 'pages[6]': 'MonitMain', 'pages[7]': 'HostManage'}

解决问题:

在前端对发送的数据中的数组用json进行格式化处理

newTab.pages = window.JSON.stringify(treeKeys) 

其中newTab是我创建的存储数据的对象，treeKeys就是数组数据，在处理之后，后端接收的数组就变成了字符串的形式。
如果你需要的是数组的形式，你可先将[]和""去除，然后用split(",")将它变为数组。

{'key': 'test', 'description': 'test', 'pages': '["Dashbord","Permission","PageUser","PageAdmin","Roles","MonitorMain","MonitMain","HostManage"]'}

加一个window是因为我是在vue中进行处理的，调用JSON需要在前面加一个window。

原因分析:

这是使用python框架时框架自定义的处理一个键带多个值的方案。使用JSON.stringfy的方法是将数组序列化成字符串，所以传递到后端就不会出现这个问题了。