Form表单如何传递List数组对象到后台的解决办
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Form表单如何传递List数组对象到后台的解决办相关的知识，希望对你有一定的参考价值。
参考技术A java中使用request.getParameter("参数名")方法来获取form表单传过来的数据。具体代码如下：
jsp代码：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Demo</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
</head>
<body>
<form action="demoServlet" method="post">
如何使用 vform 将对象数组传递给 laravel
【中文标题】如何使用 vform 将对象数组传递给 laravel【英文标题】：How to pass an array of objects using vform to laravel 【发布时间】：2021-08-15 10:34:23 【问题描述】：我正在使用 vForm 将数据发布到 laravel 后端。表单数据包含我使用动态输入修改的对象数组。我不知道我将在表单中发送多少个对象，这就是我使用数组的原因 这是向数组添加一些对象后 vform 对象的样子
form : new vForm(
field1 : '',
field2 : '',
array : [
field1 : '' ,
field2 : '' ,
field3 : ''
,
field1 : '' ,
field2 : '' ,
field3 : ''
,
field1 : '' ,
field2 : '' ,
field3 : ''
]
)
我的计划很简单，遍历对象并为它们创建模型。这里的问题是 laravel 以不同的方式接收数据，它将每个对象的每个项目都作为对象本身处理！我最终在数组中得到了 9 个对象而不是 3 个！
vuejs 发送的内容
field1 : '',
field2 : '',
array : [
field1 : '' ,
field2 : '' ,
field3 : ''
,
field1 : '' ,
field2 : '' ,
field3 : ''
,
field1 : '' ,
field2 : '' ,
field3 : ''
]
laravel 收到的内容（返回 $request）
field1 : '',
field2 : '',
array : [
field1 : '' ,
field2 : '' ,
field3 : '' ,
field1 : '' ,
field2 : '' ,
field3 : '' ,
field1 : '' ,
field2 : '' ,
field3 : ''
]
我尝试解决它
我搜索了解决方案，我发现您可以在发送表单数据之前修改表单数据，然后使用 vform 中的传输数据，但它对我不起作用，所以我最终做的是将数组作为 json 字符串传递并解码它在后端，我用过
this.form.array = JSON.stringify(this.form.array) ;
$array = json_decode($request->array);
但是我必须在发布请求之后对其进行解析，这样它就不会弄乱我的动态输入，因为我使用 vfor 循环遍历数组并且 stringify 会将其更改为字符串，并且我将有很多字段由循环..
我错过了什么吗？这是解决问题的好方法吗？还有其他方法可以使用 vform 吗？
【问题讨论】：
尝试使用this.someOtherDataVariable = JSON.stringify(this.form.array) ; 而不是this.form.array = JSON.stringify(this.form.array) ; 并将this.someOtherDataVariable 发送到formadata 和服务器这将使您的v-for 循环继续工作
是的，它会工作，我试过了！但这将使我失去我的 vform 功能，我将无法获得错误或自动更新 vform .. 我想用我的 vform 原样发送它，并且循环运行良好，因为我正在重置它而无需等待请求。
如果您使用单独的变量来存储它，为什么它会影响您的 vform？它不应该发生..好奇
我是否能够检测错误并将它们链接到每个对象？另外，我正在传递所有的 vform，其中我有数组。 如果我使用 this.form.post 我应该如何在 vform 中传递新变量？你的意思是我单独通过了吗？
我已经添加了答案，你应该从你的表单数据中进行深拷贝
【参考方案1】：
将表单的深拷贝与实际表单分开，然后使用 stringify 和 formata 并使用深拷贝表单发布请求。
data: function ()
return
formTemp: new vForm(),
form: new vForm(
field1: "",
field2: "",
array: [
field1: "",
field2: "",
field3: "",
,
field1: "",
field2: "",
field3: "",
,
field1: "",
field2: "",
field3: "",
,
],
),
;
let keys = Object.keys(this.form);
let keysT = Object.keys(this.formTemp);
let objectKeys = keys.filter((n) => !keysT.includes(n));
for (var j = 0; j < objectKeys.length; j++)
this.formTemp[objectKeys[j]] = this.form1[objectKeys[j]];
this.formTemp.array = JSON.stringify(this.formTemp.array);
在您的表单数据中使用 this.formTemp 并发送发布请求
【讨论】：
谢谢你的回答，但你没有明白我不想复制任何东西，我已经做了它并且它使用一个 vform 对象，而且我看不出你的提议和你的提议有什么区别我说我试过了，我试过复制，我没有反馈也没有验证 ofc，因为我不想更改我在模板中使用的 vform。我要求一种比我使用的更简单的方法。如果有任何问题 你试过浅拷贝还是深拷贝？因为浅拷贝会影响你的vform而不是深拷贝。 我确实搜索过深拷贝，但它不会修复任何东西，因为它是一个副本，浅层似乎做了一些引用，但我仍然不想要任何副本，我所做的解决方案更轻，如果我这样做内存引用它会影响循环，因为我正在同时更改它们 哈哈哈这是你的电话，在你的空闲时间试试这个深拷贝。 ;) 感谢大佬的努力，我会详细检查这些方法，我会看到，我已经推入 main 稳定 xd 我只是怀疑这是否是最简单的方法..但我会检查你的以上是关于Form表单如何传递List数组对象到后台的解决办的主要内容，如果未能解决你的问题，请参考以下文章
form表单传递数组到后台之后，后台怎么提取这个数组里面的值进行判断？