Question

因此，我正在使用来自API的数据在React中构建基本的方面搜索，但是我正努力从发送回服务器的有效负载中添加和删除值。有效负载对象可以包含数组，对象和字符串。所以说我有一个有效载荷结构，如下所示：

payload = {
   search_query: ""
   topic: [],
   genre: [],
   rating: "",
   type: {}
}

使用deepmerge，我可以将多个值传递回可以正常工作的API，因此示例有效负载为...

payload = {
   search_query: "Luther"
   topic: ["9832748273", "4823794872394"],
   genre: ["3827487483", "3287483274873"],
   rating: "18",
   type: {
     args: {
       when: "today",
       min: 15
     },
     name: "spot"
   }
}

到目前为止，我得到了预期的结果。现在，我在构面上进行了切换，以将其从有效负载中删除，这会将值发送回函数以从有效负载中删除。例如：

清除搜索，要删除的值=“路德”
切换主题，要删除的值=“ 9832748273”
类型切换，要删除的值=“ 3827487483”
切换等级，要删除的值=“ 18”
切换类型，要删除的值= { args: { when: "today", min: 15}, name: "spot"}

搜索和评分将返回空字符串，主题和体裁将删除数组中的项目，类型将返回一个空对象。

这可以删除数组值，但是感觉很脏，我想要一种干净的方法来处理所有类型！

const removeObjValue = (obj, filterValue) => {
  Object.entries(obj).forEach(([key, value]) => {
    Object.entries(value).forEach(([subKey, subValue]) => {
      if(subvalue === filterValue) {
        if(Array.isArray(value)) {
          const index = value.indexOf(subvalue);
          if (index > -1) {
            value.splice(index, 1);
          }
        }
      }
    });
  });
  return obj;
}

Answer 1

我只使用delete关键字删除对象属性，就像这样

if (payload[key]) {
 if (payload[key] instanceof Array) {
    var idx = payload[key].indexOf(value);
  if (idx > -1) payload[key].splice(idx, 1);
 } else {
    delete payload[key];
 }
}

code example

从JavaScript对象递归添加和删除值

1 个答案: