ES6解構從內部數組中獲取第n個項目

Question

我的 React 項目中有一個處於我狀態的數組。 就像是 ：

state = {
   cats : [
      {cid : 1 , value : 1}
      {cid : 2 , value : 3}
      {cid : 3 , value : 4}
   ],
   curpage : 3
}

現在我想要的就是通過析構獲得數組cats nth item 。 我試過

const { cat : {cats[id]} } = this.state;

或者

 const { cats[id] } = this.state;

Answer 1

您可以使用具有解構的計算對象屬性來獲取第n個數組項並將其分配給一個變量：

 const state = { cats : [ {cid : 1 , value : 1}, {cid : 2 , value : 3}, {cid : 3 , value : 4} ], curpage : 3 } const n = 2; const { cats: { [n]: nthCat} } = state; console.log(nthCat)

或者，如果n很小並且您事先知道它，則可以忽略不需要的值：

 const state = { cats : [ {cid : 1 , value : 1}, {cid : 2 , value : 3}, {cid : 3 , value : 4} ], curpage : 3 } const { cats: [,,thirdCat] } = state; console.log(thirdCat)

Answer 2

您可以解構索引並采用重命名的值。

 var state = { cats: [{ cid: 1, value: 1 }, { cid: 2, value: 3 }, { cid: 3, value: 4 }], curpage: 3 }, index = 2, { cats: { [index]: item } } = state; console.log(item);

Answer 3

讓 nthID = 1; 讓 {cats} = 狀態； 讓 nthChild = 貓 [nthID];