代码段

Question

我正在构建一个全栈应用程序，在该应用程序中，我有一个表单将数据提交到我的其中一条路线。在此表单上，我可以将所有输入字段都捆绑到req.body.model中，这是由于我可以像在name="model[height]"一样在键周围添加带有方括号的name属性。

这应该等同于以下内容：

model = {
    height: //value,
    weight: //value,
    age: //value
}

但是，我希望其中一个值是一个空数组，以便可以将URLS推入数组，如下所示：

model = {
    height: //value,
    weight: //value,
    age: //value,
    urls: [//urls here]
}

由于您可以使用name属性自动创建对象，所以我想知道是否存在一种使用name属性创建嵌套数组的方法？

代码段

<form>
    <input type="text" name="model[height]">
    <input type="text" name="model[weight]">
    <input type="text" name="model[age]">

    // these 2 inputs would go into the urls key in the models object
    <input type="text">
    <input type="text">


    <button>Submit</button>
</form>

不确定我的措词是否正确...但是请告诉我是否可以进一步解释。

Answer 1

如果在属性旁边传递索引，则可以创建一个数组。像这样

 // these 2 inputs would go into the urls key in the models object
    <input type="text" name="model[urls][0]">
    <input type="text" name="model[urls][1]">

Answer 2

不确定我是否知道您要尝试做的事情，但是看来您可以先处理提交的数据，然后将处理后的数据发送到想要发送的任何位置。它有点冗长，但是我觉得它在组织数据时可能会给您带来更大的灵活性。因此，也许您可以执行以下操作：

html

<form name="model">
  <input type="text" id="height">
  <input type="text" id="weight">
  <input type="text" id="age">
  <input type="text" id="url1">
  <input type="text" id="url2">
  <button onclick="processForm()">Submit</button>
</form>

脚本

function processForm() {

    let height = document.querySelector("#height").value;
    let weight = document.querySelector("#weight").value;
    let age = document.querySelector("#age").value;
    let url1 = document.querySelector("#url1").value;
    let url2 = document.querySelector("#url2").value;

    let model = {
      "height": height,
      "weight": weight,
      "age": age,
      "url": [url1, url2]
    }

    // now you can send model object to where it is needed
}

有没有一种方法可以使用表单内的name属性在对象内部嵌套数组？

代码段

2 个答案: