Javascript 使用递归函数修剪字段不会'；I don’我没有按预期工作

我试图在提交表单之前修剪表单的字段，但由于某些原因，这些值保持不变。递归函数定义为：

const trimFields = form => _.forIn(form, element => isObject(element) ? trimFields(element) : trimText(element))

但这根本不起作用，它似乎只是保持了原始值

我做错了什么

---

递归函数实际上从未修改

表单

或返回有用的内容。当遇到带有字符串（或非对象）的值时，需要修改对象的键。如果对象遇到值，可以再次调用函数来修剪其值

const trimFields = form => _.forIn(form, (element, k) => {
  if(_.isObject(element)) {
    trimFields(element)
  } else {
    form[k] = _.trim(element); // set the object's key to be the trimmed version of its element
  } 
});

trimFields(form);
// set the values of the elements... 

不过，上面的方法并不需要lodash方法，您可以使用标准的内置结构来执行所需的操作

话虽如此，我建议您使用生成一个新的表单对象，而不是修改当前的表单对象。这是通过返回对象应采用的新值来实现的。如果

元素

是一个对象，则可以在其上递归地重新运行函数，以映射

元素

的对象。如果它不是对象，可以使用lodash的方法返回当前对象值的修剪值

const trimFields = form => _.mapValues(form, 
  element => _.isObject(element) ? trimFields(element) : _.trim(element)
);

见下例：

const form={name:'John Doe'，email:'john@doe.com，句柄：'jdoe'，社交：{facebook:'johndoe's page'，twitter:'jdoe'}；
const trimFields=form=>，
元素=>.isObject（元素）？trimFields（元素）：\u0.trim（元素）
);
const new_form=trimFields（form）；
document.getElementById（'name'）。value=new\u form.name；
document.getElementById（'email'）。value=new\u form.email；
document.getElementById（'handle'）。value=new\u form.handle；
document.getElementById（'facebook'）。value=new\u form.social.facebook；
document.getElementById（'twitter'）.value=new\u form.social.twitter
如果您：

从不实际触发
trimFields
。缺少trimFields（表单）
用
表格中的数据填充输入
。您要修剪的值永远不会用于填充表单字段。换句话说，您并没有改变原始的
表单
对象
我看不到你的fiddle函数调用trimFields这里有一些小的调整，效果很好