如何使用VueJS或javascript搜索多维数组

时间:2017-05-23 22:12:24

标签: javascript arrays multidimensional-array vue.js frontend

我正在开发一个Vue项目而且我刚接触Vue JS,我的问题是如何在输入时返回id为 1 的所有数据一个值。下面是我的数据的示例结构。

 {
    'A': [{
        1: [{
            id: 1, 
            name: 'John'
        }],
        2: [{
            id: 5,
            name: 'Ken'
        }]
    }],
    'B': [{
        1: {
            id: 1,
            name: 'Leena'
        }
    }],
    'C': [{
        1: [{
            id: 1,
            name: 'Jesica'
        }],
        2: [{
            id: 18,
            name: 'Mike'
        }]
    }]
}

预期结果应该是(下面),因为它们都具有相同的id值

{
    'A': [{
        1: [{
            id: 1, 
            name: 'John'
        }]
    }],
    'B': [{
        1: {
            id: 1,
            name: 'Leena'
        }
    }],
    'C': [{
        1: [{
            id: 1,
            name: 'Jesica'
        }]
    }]
}

1 个答案:

答案 0 :(得分:3)

如果您对数据结构的格式有任何控制权,我会将其更改为更易于管理的内容。例如,将每个大写字母属性设置为对象数组:

let dataset = { 
  'A': [{id: 1, name: 'John'}, {id: 2, name: 'Sally'}],
  'B': [{id: 1, name: 'Bob'}],
  ...
}

更好的做法是使数据结构成为一个对象数组,其大写字母为group属性值,id-name对象为people属性值(或任何有意义的对象)你):

let dataset = [{
    group: 'A', people: [{id: 1, name: 'John'}, {id: 2, name: 'Sally'}],
  }, {
    group: 'B', people: [{id: 1, name: 'Bob'}],
  }, {
    ...
}]

使用此结构,按特定ID过滤数据会相对简单:

function filterObject(foo, id) {
  return foo.map(i => i.people.filter(j => j.id == id));
}

Here's a working fiddle.

如果你真的需要使用你提供的疯狂数据结构,这里有一个能满足你需要的功能:

let filterObject = function(foo, id) {
  let bar = {};

  Object.keys(foo).map((key) => {
    for (let i = 0; i < foo[key].length; i++) {
      Object.keys(foo[key][i]).map((index) => {
        for (let j = 0; j < foo[key][i][index].length; j++) {
          if (foo[key][i][index][j].id != id) {
            continue;
          }

          if (!bar[key]) {
            bar[key] = [];
          }
          if (!bar[key][i]) {
            bar[key][i] = {};
          }
          if (!bar[key][i][index]) {
            bar[key][i][index] = [];
          }

          bar[key][i][index][j] = foo[key][i][index][j];
        }
      })
    }
  });

  return bar
}

Here's a working fiddle.