如何把一個項到一個數組，如果它是一個JavaScript對象內部[state.lastValue.push不是函數]

Question

我在reactjs更新一些值作爲javascriptobject我reducer內部像的下方。

這是更新

state = { 
    result:1, 
    lastval: [] 
} 

前的對象，這是我要如何更新它，

state = { 
     ...state, 
     result:state.result + 400, 
     lastval: result.lastval.push(20) 
    } 

所以這給了我的state.lastValue.push is not a function錯誤。但如果我這樣做就像下面這樣很好，

state = { 
      ...state, 
      result:state.result + 400, 
     }; 
     state.lastval.push(20); 

這很好。是什麼原因。

Answer 1

更新您的狀態就像

state = { 
    ...state, 
    result:state.result + 400, 
    lastval: [...state.lastval, 20] 
} 

lastval: [...state.lastval, 20]將解構state.lastval數組內的所有內容，並將其添加20並將其重新包裝到數組中。

欲瞭解更多關於什麼[...state.lastval]沒有讀取的信息What is the meaning of this syntax "{...x}" in Reactjs

Answer 2

原因是，當你寫：

state = { 
    ...state, 
    result:state.result + 400, 
    lastval: result.lastval.push(20) 
} 

狀態的最終狀態將是：

state = { 
    ...state, 
    result: some value 
    lastval: 20 
} 

手段state.lasteval將成爲數，它不會是一個array，因爲a.push（1）不會返回最終數組，它將返回推入array的項目。

寫這樣的更新狀態：

state = { 
    ...state, 
    result: state.result + 400, 
    lastval: [...state.lastval, 20] 
} 

檢查這個片段：

let a = [1,2]; 
 

 
let b = []; 
 

 
b = a.push(3); 
 

 
console.log('a', a); 
 

 
console.log('b', b);