如何强制 axios 发送空数组？答案

【问题标题】：How can I force axios to send empty array?如何强制 axios 发送空数组？
【发布时间】：2020-03-14 12:07:31
【问题描述】：

我正在使用 axios 从 vue.js 应用程序，方法 PATCH 发送一个整数数组。

如果有值，则按预期传递数据。

但如果没有（例如从多选中删除的所有项目），则有效负载为空。我需要发送它，以便可以从数据库中删除项目，这是一个非常正常的用例。

我的更新方法如下：

 update({ commit, dispatch }, data) {
    return new Promise((resolve, reject) => {
      const params = {};
      params[data.name] = data.value;
      console.log(params)
      axios({ url: '/api/' + module + '/' + data.id, params, method: 'PATCH' })
        .then(response => {
          //Replace the full object in the store with the one we get back from the patch operation
          commit('update', response.data.data);
          dispatch('postUpdate', data)
          resolve(response)
        })
        .catch(err => {
          reject(err)
        })
    })

我的 console.log 确认 params 数组是我期望的方式

Object { data_items: [] }

但是网络请求显示它正在被删除并且没有发布任何内容。

我还可以确认，当我选择任何值时，请求会按预期工作并发送到服务器以进行持久化。

例如

请求填充选择 http:///api/processes/16?data_items[]=2

请求清空选择 - 没有查询参数 http://example.com/api/processes/16

如何强制 axios 发送空数组？

【问题讨论】：

将数组包装在对象中的任何特定原因，您都可以自己发送数组。默认情况下，Axios 不会删除这些值，如果您的有效负载是您所说的那样，Axios 将发送它。您能否提供发送请求的示例？
没有特别的理由使用一个对象，我可能不假思索地做了。我已经将它换成一个数组并得到相同的结果。我已将URL添加到帖子中以说明选择清空时会发生什么。 span>
我不得不说我很困惑为什么“data_items”是一个查询参数。数据应该是请求正文的一部分。你能提供一个小提琴让我们重现吗？
我也有同样的问题。我正在发送一个序列化为对象的表单，如果其中一个值是空数组，axios 出于某种原因将其从请求中剥离。
我也有同样的问题。我目前正在保存一个对象，该对象具有一个带有数组值的键。然而，这个数组有时可能是空的，因为用户不能选择一个选项。所以，当我用这个键和一个空数组发送这个对象时，接收请求的地方是空的，而不是空数组[]。

标签： javascript axios

【解决方案1】：

使用querystring's stringify 作为序列化程序并向空列表添加一个空字符串对我有用。

例如

const queryObject = {myList: myList.length > 0 ? myList : ['']}


return axios.get(url, {params: queryObject, paramsSerializer: querystring.stringify}).then(...)

然后 url 变为 http://example.com?myList= 我的后端将其解释为接收 myList 查询参数的空列表。

【讨论】：

谢谢！这可行，但它将一个空数组转换为一个包含一个空项的数组，querystring 会很乐意将其字符串化。希望有一个类似于skipNull and skipEmptyString 的skipEmptyArray: true/false 属性