前端接收一个数组作为[object Object]

Question

我正在使用 JavaScript、express.js、ejs 和 Node.js 构建一个网站，但我遇到了一个问题。

我用这种方式向前端发送一个数组：

const dataToSend = [
  {
    id: "ID",
    name: "Name"
  },
  {
    id: "ID",
    name: "Name"
  }
]

res.render('configure', {
    array: dataToSend
});

并以这种方式使用 ejs 将其放在前端：

<%= array %>

如果我在前端打印数组，结果将是

[object Object]

，我还打印出

typeof('<%= array %>')

，它返回字符串。

我找到了一些与此相关的主题，但找不到任何有帮助的内容。 我想知道执行此操作的正确方法是什么。谢谢。

Answer 1

这里的问题是数组正在转换为字符串。在 JavaScript 中，对象 (

{...}

) 有一个

toString

方法，默认返回字符串

[object Object]

。

要解决此问题，您需要确保数组没有转换为字符串。

在EJS中，您有多种标签可供选择：

Tags
<% 'Scriptlet' tag, for control-flow, no output
<%_ ‘Whitespace Slurping’ Scriptlet tag, strips all whitespace before it
<%= Outputs the value into the template (HTML escaped)
<%- Outputs the unescaped value into the template
<%# Comment tag, no execution, no output
<%% Outputs a literal '<%'
%> Plain ending tag
-%> Trim-mode ('newline slurp') tag, trims following newline
_%> ‘Whitespace Slurping’ ending tag, removes all whitespace after it

来源：https://ejs.co/

您可能正在寻找这个：

<%-

来输出

JSON.stringify

'd数组。

<%- JSON.stringify(array) %>

Answer 2

您是否在脚本中分配数组？如果是的话，你会得到一个字符串。试试这个： 在脚本标签之外，对 JSON 进行字符串化并将其分配给这样的变量：-

<% let theArray = JSON.stringify(array) %>

然后在脚本标签中，JSON.parse ejs 局部变量 theArray 为变量。 像这样：-

<script>
let arrayFromEjs = JSON.parse("<%- theArray %>");
</script>