从 axios 获取的数据无缘无故地存储在一个额外的数组中

Question

我正在从 mongo 获取以下数据：

"data": [
{
"_id": "5ee3f064344d21fb2645f5c0",
"name": "John",
"surname": "Doe",
"email": "[e-mail]",
"createdAt": "2020-06-12T21:15:16.624Z",
"__v": 0
},
{
"_id": "5ee5e27f1ecd8f05ad764057",
"name": "Jane",
"surname": "Doe",
"email": "[e-mail]",
"createdAt": "2020-06-14T08:40:31.701Z",
"__v": 0
}

我正在使用 axios 来获取数据。下面是我正在获取数据的代码：

async function getUser() {
const user = await axios.get('/api/plugins/users');
dispatch({
type: 'GET_USER',
payload: user.data.data,
});
}

数据都很好，但问题是我在另一个数组中获取数据数组，我不确定如何。

这是我得到的：

[
[
{"_id":"5ee3f064344d21fb2645f5c0","name":"John","surname":"Doe","email":"[e-mail]","createdAt":"2020-06-12T21:15:16.624Z","__v":0},
{"_id":"5ee5e27f1ecd8f05ad764057","name":"Jane","surname":"Doe","email":"[e-mail]","createdAt":"2020-06-14T08:40:31.701Z","__v":0}
]
]

这是我的初始状态和化简器，两者都在单独的文件中：

const initialState = {
users: [],
loading: true,
};
case 'GET_USER':
return {
...state,
users: [...state.users, action.payload],
loading: false,
};

这对我来说似乎很奇怪，我不确定是什么原因导致它将数据放入另一个数组中。有人可以看看吗？

Answer 1

action.payload

是一个数组。状态合并在

case 'GET_USER':
return {
...state,
users: [...state.users, action.payload], //it's wrong.It will create nested array
loading: false,
};

它应该是

users: [...state.users, ...action.payload], // spread array element in users