根据传递的对象更新对象数组答案

【问题标题】：Update array of objects based on the object passed根据传递的对象更新对象数组
【发布时间】：2020-11-01 09:40:38
【问题描述】：

我有一个具有以下格式的对象数组，

const options = [
  { key: 1, text: "Name", value: "name", icon: "sort" },
  { key: 2, text: "Time", value: "time", icon: "sort" },
  { key: 3, text: "Type", value: "type", icon: "sort" }
];

现在根据输入的格式 {fieldName,order} 我必须修改数组。基本上 order 将采用两个值“asc”或“desc”，而 fieldName 将采用 options 数组的 value 属性中的任何值。

例如：{ fieldName: "name", order : "asc"} 或 { fieldName: "type", order: "desc"}

现在基本上基于这个顺序，我已经为那个字段修改了源数组的icon字段。

如果order 为asc，则将该字段的icon 属性更改为sort up。如果其顺序为desc，则更改@987654327将该字段的@属性设置为sort down

例子

1) sortBy: { fielName: "name", order:"asc"} 

//Output
[
  { key: 1, text: "Name", value: "name", icon: "sort up" },
  { key: 2, text: "Time", value: "time", icon: "sort" },
  { key: 3, text: "Type", value: "type", icon: "sort" }
];

2) sortBy: { fielName: "type", order:"desc"} 

//Output
[
  { key: 1, text: "Name", value: "name", icon: "sort" },
  { key: 2, text: "Time", value: "time", icon: "sort" },
  { key: 3, text: "Type", value: "type", icon: "sort down"}
];

它应该只更新传递给它的字段icon，其余字段icon应该设置为“排序”

这是我尝试过的

const options = [
  { key: 1, text: "Name", value: "name", icon: "sort" },
  { key: 2, text: "Time", value: "time", icon: "sort" },
  { key: 3, text: "Type", value: "type", icon: "sort" }
];

function updateArray(obj)
{
   const newArr = options.map(item => {
     if(item.name === obj.fieldName) {
    return {...item, icon: obj.order === "desc" ? "sort-desc" :"sort-asc" };
    }
    return {...item};
   });
   return newArr;
}

【问题讨论】：

标签： javascript arrays ecmascript-6 ecmascript-5 ecmascript-2016

【解决方案1】：

试试这个

const options = [
  { key: 1, text: "Name", value: "name", icon: "sort" },
  { key: 2, text: "Time", value: "time", icon: "sort" },
  { key: 3, text: "Type", value: "type", icon: "sort" }
];
function sorta(op,options){
   field =op.fielName
   newarray=[]
   options.forEach(o=>{
     if(o.value==field){
      op.order=="asc"?f="up":f="down"
      o.icon="sort-"+f
      newarray.push(o)
     }
      else newarray.push(o)
  })
     return newarray
}

console.log(sorta({ fielName: "name", order:"asc"},options ))

【讨论】：

谢谢。这超越了现有的阵列。我在反应的上下文中使用它
你想要一个新数组吗？
是的，这里看起来像您的硬编码，o.icon="sort-"+op.order。实际上，如果是“decsc”，它是“排序”，如果是 asc，它是“排序”。抱歉添加了编辑
但是在你的问题中你使用了 sort desc 和 sort asc 我在你的问题中上下都没有，你能指出你问题中提到的地方吗？
是的，我在评论中提到了:) 抱歉忘记添加了

【解决方案2】：

您的函数有效，但您正试图访问一个不存在的属性。

我认为应该是：

if(item.value === obj.fieldName) {
  ...
}

演示：

const options = [
  { key: 1, text: "Name", value: "name", icon: "sort" },
  { key: 2, text: "Time", value: "time", icon: "sort" },
  { key: 3, text: "Type", value: "type", icon: "sort" }
];

function updateArray(obj)
{
   const newArr = options.map(item => {
     if(item.value === obj.fieldName) {
    return {...item, icon: obj.order === "desc" ? "sort-desc" :"sort-asc" };
    }
    return {...item};
   });
   return newArr;
};

console.log(updateArray({fieldName: 'type', order: 'desc'}));
console.log(updateArray({fieldName: 'time', order: 'asc'}));
console.log(updateArray({fieldName: 'name', order: 'desc'}));

【讨论】：

@li97 你确定吗？查看演示。