如何遍历不同的变量/状态以创建对象?

时间:2019-01-07 18:18:56

标签: javascript arrays reactjs javascript-objects react-hooks

我需要遍历变量/状态元素来创建对象的帮助。我将遍历firstName状态,lastName状态以及更多其他状态。代码变得太复杂了。想知道是否有适当的方法来为graphql调用构建对象吗?还是只是一种更好的方式来构建对象?

我有一个个人资料页面,其中包含用于更新用户帐户的表格。每个表单输入都有state和setState道具。在提交表单时,需要对照状态中存储的帐户对象中存储的先前查询的信息来检查这些值。我正在使用graphql端点,当我打电话进行更新帐户呼叫时,graphql呼叫中的每个参数值都有3个选择。例如,firstName可以是 1)空(在数据库中删除) 2)一些非空值(在数据库中更改为该值) 3)调用graphql调用中不存在该字段(对该属性不执行任何操作) 下面的代码我要做20个状态值,这是不实际的。

// If there is a difference between client's firstName and queried firstName in server
if (firstName != account.firstName) {
  //If we stored firstName as empty String
  if(firstName === ''){ 
    //If the firstName queried is not empty
    if(account.firstName != null) {
      //Set the objects first name attribute to null, so server deletes field
      input['firstName'] = null;
    } else {
      //firstName is empty string and server value is null, so do nothing, do not add attribute firstName to object "input"
    }
  } else {
    //firstName is not an empty string so add it to object value
    input['firstName'] = firstName;
  }
}

如果有更好的方法可以做到这一点,我很乐意提供帮助。

2 个答案:

答案 0 :(得分:0)

一种解决方法是使用方括号表示法来提取要为其提取值的key以及需要对其进行检查的值。

function getComputedValue(value, key) {
  if (value != account[key]) {
    if (value === '') {
      if (account[key] != null) {
        input[key] = null;
      } else {
        
      }
    } else {
      input[key] = value;
    }
  }
}

let firstName = getComputedValue("Tom", "firstName");
let lastName = getComputedValue("Smith", "lastName");

答案 1 :(得分:0)

有很多方法可以解决此问题。我建议您使用Underscore JS提供的某些功能:

pairs_.pairs(object)

将对象转换为[key, value]对的列表。与对象相反。

_.pairs({one: 1, two: 2, three: 3});
=> [["one", 1], ["two", 2], ["three", 3]]

然后您可以遍历数组

_.each(array, function(pair) {
// Insert the input assignment code here for each key  
});