在 Express.js 中，我们经常会使用 POST 请求来传递参数。但是，当我们需要传递数组类型的参数时，却会遇到一些问题。本文将介绍如何解决这个问题，并给出示例代码。
问题描述
假设我们有一个表单，其中有一个输入框可以输入多个值，我们想要将这些值以数组的形式传递给后端。我们可以通过以下代码来实现：
<form action="/submit" method="POST"> <input type="text" name="values[]" /> <input type="text" name="values[]" /> <input type="text" name="values[]" /> <button type="submit">提交</button> </form>
在后端，我们可以通过以下代码来获取这些值：
app.post('/submit', (req, res) => {
const values = req.body.values;
console.log(values); // undefined
});但是，这样获取到的 values 为 undefined，而不是我们期望的数组。
解决方法
为了解决这个问题，我们需要在前端和后端分别进行处理。
前端处理
在前端，我们可以将多个输入框的值合并成一个数组，然后将这个数组作为参数传递给后端。修改代码如下：
<form action="/submit" method="POST"> <input type="text" name="values" /> <input type="text" name="values" /> <input type="text" name="values" /> <button type="submit">提交</button> </form>
-- -------------------- ---- -------
----- ---- - -------------------------------
------------------------------- ------- -- -
-----------------------
----- ------ - ----------------------------------------------
----- ------ - ---------------------------- -- -------------
---------------- -
------- -------
-------- -
--------------- ------------------
--
----- ---------------- ------ --
---
---在前端，我们将多个输入框的值合并成一个数组，并使用 fetch API 发送 POST 请求。注意，我们需要设置请求头的 Content-Type 为 application/json，这样后端才能正确地解析我们发送的数据。
后端处理
在后端，我们需要对传递过来的参数进行特殊处理，才能正确地获取到数组类型的参数。修改代码如下：
const bodyParser = require('body-parser');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.post('/submit', (req, res) => {
const values = req.body.values || [];
console.log(values); // ['value1', 'value2', 'value3']
});在后端，我们使用了 bodyParser 中间件来解析请求体。注意，我们需要同时使用 bodyParser.json() 和 bodyParser.urlencoded()，并将 extended 参数设置为 true，这样才能正确地解析发送过来的 JSON 数据。
在获取参数时，我们需要将 req.body.values 转换成数组，如果没有传递该参数，则默认为一个空数组。
示例代码
完整的示例代码如下：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
----------------- ---- -------------------
-------
------
----- ---------------- --------------
------ ----------- ------------- --
------ ----------- ------------- --
------ ----------- ------------- --
------- -------------------------
-------
--------
----- ---- - -------------------------------
------------------------------- ------- -- -
-----------------------
----- ------ - ----------------------------------------------
----- ------ - ---------------------------- -- -------------
---------------- -
------- -------
-------- -
--------------- ------------------
--
----- ---------------- ------ --
---
---
---------
-------
--------- -------------------- ---- ------- ----- ------- - ------------------- ----- ---------- - ----------------------- ----- --- - ---------- --------------------------- ------------------------------- --------- ---- ---- ------------------- ----- ---- -- - ----- ------ - --------------- -- --- -------------------- -- ---------- --------- --------- --- ---------------- -- -- - ------------------- -- ------- -- ------------------------ ---
总结
在 Express.js 中，我们可以通过前端和后端的特殊处理来解决 POST 请求传递数组参数的问题。前端需要将多个输入框的值合并成一个数组，并使用 fetch API 发送 POST 请求；后端需要使用 bodyParser 中间件来解析请求体，并将 req.body.values 转换成数组。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/650d06c595b1f8cacd6c742c