【问题标题】:Change object property of an object inside an array inside another array更改另一个数组内的数组内对象的对象属性
【发布时间】:2020-08-15 14:51:27
【问题描述】:

其实我已经做到了,但我相信你可以用 ES6 做到这一点。

不管你的逻辑,目标是在嵌套数组中找到一些对象并更改数据(更改属性对象):

let selectedItem = { LinkID: 1 }; // item to be changed inside my vuex store

//sindecs is a property inside my vuex store

let sindecs = [
  {
    estado: { id: 2, siga: "AL", nome: "Alagoas" },
    uf: { id: 2, nome: "SP" },
    link: [
      { LinkID: 1, Link: "link1", Active: false },
      { LinkID: 2, Link: "link 2", Active: false }
    ],
    SindecID: 3
  },
  {
    estado: { id: 19, siga: "RJ", nome: "Rio de Janeiro" },
    uf: { id: 1, nome: "RJ" },
    link: [{ LinkID: 3, Link: "rio", Active: false }],
    SindecID: 4
  }
];



//this is the for inside my mutations, I want to change here to a easier way to change the value.
for (let i = 0; i < sindecs.length; i++) {
  for (let j = 0; j < sindecs[i].link.length; j++) {
    if (sindecs[i].link[j].LinkID === selectedItem.LinkID) {
      sindecs[i].link[j].Active = !sindecs[i].link[j].Active;
    }
  }
}

非常感谢您。

【问题讨论】:

  • 更简单的意思是没有 2 个循环?
  • 是的兄弟,更聪明的方法..想象一下如果我有 3 个嵌套数组?这将是一个地狱哈哈哈....
  • 从性能的角度来看,如果不更改状态的数据结构,您将无法做很多事情。
  • 我没有得到你...
  • 所以在你的sindecs,你必须做sindecs[0].link[0].LinkID。所以你需要将标识符上移两级,这样你就可以直接做sindecs[0].LinkID。但是 LinkID 不是唯一的,因此您必须进行一些操作以使标识符始终是唯一的。看看这个github.com/paularmstrong/normalizr 可能会有所帮助。

标签: javascript ecmascript-6 vuex


【解决方案1】:

ES6 中类似。只是clean syntax

const toggleState = (sindecs, id) => {
  sindecs.forEach((sinde) => {
    const link = sinde.link.find((s) => s.LinkID === id);
    if (link) link.Active = !link.Active;
  });
};
toggleState(sindecs, selectedItem.LinkID)

同上,但good in performance。如果只有one match,这将不是iterate 的所有数据。这将break loop

const toggleState = (sindecs, id) => {
  let link;
  sindecs.some((sinde) => {
    link = sinde.link.find((s) => s.LinkID === id);
    return Boolean(link);
  });
  if (link) link.Active = !link.Active;
};
toggleState(sindecs, selectedItem.LinkID);

演示:

const toggleState = (sindecs, id) => {
  let link;
  sindecs.some((sinde) => {
    link = sinde.link.find((s) => s.LinkID === id);
    return Boolean(link);
  });
  if (link) link.Active = !link.Active;
};

let selectedItem = { LinkID: 1 }; 
let sindecs = [{"estado":{"id":2,"siga":"AL","nome":"Alagoas"},"uf":{"id":2,"nome":"SP"},"link":[{"LinkID":1,"Link":"link1","Active":false},{"LinkID":2,"Link":"link 2","Active":false}],"SindecID":3},{"estado":{"id":19,"siga":"RJ","nome":"Rio de Janeiro"},"uf":{"id":1,"nome":"RJ"},"link":[{"LinkID":3,"Link":"rio","Active":false}],"SindecID":4}];
toggleState(sindecs, selectedItem.LinkID);
console.log(JSON.stringify(sindecs, null, 2)) // update..

【讨论】:

  • 老兄,我完全理解你了,是的,但我不知道如何将这个末端链接对象附加到 sindec,你能更容易吗?
  • 我没找到你。你给我样品。我加了一个。
  • 即使您更改链接也很有趣。如果不引用状态,它将更改 sindecs 数组对象。它的作品,非常感谢!
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-10-22
  • 2011-08-31
  • 1970-01-01
  • 2022-12-17
  • 2021-08-22
  • 2019-10-18
相关资源
最近更新 更多