物件嵌套減少或映射為一個物件

我昨天有一個關于如何平鋪另一個JSON的問題，我的貝類嵌套有'name'，股票型別也是用'name'嵌套的，我得到的答案是如何平鋪所有帶有子道具'name'的物件，使用后我得到了這個JSON結果，需要再次平鋪這個嵌套貝類物件

 async getBatches（/span>） {
          try {
            let res = await farmStockService.getAllBatches（）。
    
            
    
            const result = res.data.data. map((element) =>/span> {
              const keysWithNameProp = Object.keys（element）。 filter(key => element[key].name !== undefined)。
              const copyOfElement = {...element};
              keysWithNameProp.forEach(prop => {
                copyOfElement[prop] = element[prop].name;
              })
              return copyOfElement;
            });
    
           
    
            this.batches = result;
    
          } catch (e) {
            console.error（e）。
          }
        },

也許有一種方法可以調整這個函式，讓它平鋪任何帶有子道具'name'和'array'的東西？我試著玩了一下，但每次都崩潰了，它也在一個vuejs組件中

現在的表格看起來是這樣的：

非常感謝您的答復！

最后一個問題：

uj5u.com熱心網友回復：

你可以使用...傳播運營商。

如果鍵不是動態的，你可以使用下面的solution1.

const response = { data: [ { name: "Batch1"/span>, description: "種子", 年齡: 2, quantity: 1000, source: "Hatchery", hatchery: "robs hatchery", location: "dingle", shellfish: { species: "牡蠣", }, grade_list: { name: "Grade0", }, stock_type: { name: "seeds"/span>, }, }, { name: "Batch2", description: "Batch2", 年齡: 20, quantity: 15700, source: "aka", hatchery: "aka", location: "dingle", shellfish: { species: "牡蠣", }, grade_list: { name: "Grade1", }, stock_type: { name: "成熟", }, }, { name: "5555", description: "45", 年齡: 1, quantity: 134, source: "fhh", hatchery: "hfhj", location: "garden", shellfish: { species: "牡蠣", }, grade_list: { name: "Grade0", }, stock_type: { name: "seeds", }, }, ], };

const result1 = response.data.map(item =>({.
  ...項。
  shellfish: item.shellfish.species。
  grade_list: item.grade_list.name,
  stock_type: item.stock_type.name。
}));

console.log({result1}); 

如果鑰匙是動態的，你可以使用下面的解決方案2。

const response = { data: [ { name: "Batch1"/span>, description: "種子", 年齡。2, quantity: 1000, source: "Hatchery", hatchery: "robs hatchery", location: "dingle", shellfish: { species: "牡蠣", }, grade_list: { name: "Grade0", }, stock_type: { name: "seeds"/span>, }, }, { name: "Batch2", description: "Batch2", 年齡: 20, quantity: 15700, source: "aka", hatchery: "aka", location: "dingle", shellfish: { species: "牡蠣", }, grade_list: { name: "Grade1", }, stock_type: { name: "成熟", }, }, { name: "5555", description: "45", 年齡: 1, quantity: 134, source: "fhh", hatchery: "hfhj", location: "garden", shellfish: { species: "牡蠣", }, grade_list: { name: "Grade0", }, stock_type: { name: "seeds", }, }, ], };

function isObject(obj) {
  return typeof obj === "object" & & obj ! == null && !Array.isArray（obj）。
}

const result2 = response.data.map(item =>  {
  const keys = Object.keys（item）。

  let flattenObj = {};
  for (const key of keys) {
    const value = item[key];
    if (isObject（value）) { .
      flattenObj = { ...flattenObj, [key]: value[Object.keys（value）[0] ] };
    }
  }
  return { ... item, ...flattenObj };
});

console.log（result2）;

uj5u.com熱心網友回復：

你可以定義一個輔助函式resolveNestedProps()，它接受一個物件和一個要尋找的屬性陣列。如果找到了其中的任何一個，它就回傳值，否則就回傳obj。請注意，這將回傳第一個匹配的屬性，所以如果你的任何物件有一個name和species，哪一個先被匹配，就會被回傳。

這里遍歷每個元素的Object. entries()，并使用Object.fromEntries()

const res = { data: { data: [ { name: 'Batch1', description: 'seed', age: 2, quantity: 1000, source: 'Hatchery', hatchery: { name: 'robs hatchery' }, location: { name: 'dingle' }, shellfish: { species: 'pacific gigas' }, stock_type: 'seeds', }, { name: 'Batch2', description: 'Batch2', 年齡: 20, quantity: 15700, source: 'aka', hatchery: { name: 'aka'/span> }, location: { name: 'dingle' }, shellfish: { species: 'pacific gigas' }, stock_type: '成熟', }, { name: '5555', description: '45', 年齡: 1, quantity: 134, source: 'fhh', hatchery: { name: 'hfhj' }, location: { name: 'garden' }, shellfish: { species: 'pacific gigas' }, stock_type: 'seeds', }, ], }, };

const resolveNestedProps = (obj, props) => {
  for (const key of props) {
    if (obj[key] !== undefined) {
      return obj[key]。
    }
  }

  return obj;
};

const nestedProps = ['name', 'species']; //定義要尋找的屬性。
const result = res.data.data。 map((element) =>。
  Object.fromEntries(
    Object.entries(element).map(([k, v]) => /span> {
      if (typeof v === 'object && v ! == null && !Array.isArray（v）) {
        v = resolveNestedProps（v, nestedProps）。
      }

      return [k, v];
    })
  )
);

console.log（result）;

.as-console-wrapper { max-height。100% ！ important; top: 0; }

標籤：

上一篇：帶有maven的gitlabCI/CD不會在application.properties中設定環境變數

下一篇：您好，我正在嘗試撰寫一種方法來復制所有元音，但前提是它們是獨立的。例如“美麗”將回傳“美麗”