如何把一个项到一个数组，如果它是一个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);