如果项目位于 javascript 对象中，如何将其推送到数组中 [state.lastValue.push 不是函数]

Posted 2023-02-21

【中文标题】如果项目位于 javascript 对象中，如何将其推送到数组中 [state.lastValue.push 不是函数]

【英文标题】：how to push an item into an array if it is inside a javascript object [state.lastValue.push is not a function]

【发布时间】：2017-10-30 12:13:57

【问题描述】：

我在reactjs 中的reducer 中将一些值更新为javascript object，如下所示。

这是更新前的对象

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);

这很好。这是什么原因。

【参考方案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

【参考方案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]

检查这个sn-p：

let a = [1,2];

let b = [];

b = a.push(3);

console.log('a', a);

console.log('b', b);