reactjs - 从 axios 获取的数据无缘无故地存储在一个额外的数组中
问题描述
我正在从 mongo 获取以下数据:
"data": [
{
"_id": "5ee3f064344d21fb2645f5c0",
"name": "John",
"surname": "Doe",
"email": "john@gmail.com",
"createdAt": "2020-06-12T21:15:16.624Z",
"__v": 0
},
{
"_id": "5ee5e27f1ecd8f05ad764057",
"name": "Jane",
"surname": "Doe",
"email": "jane@gmail.com",
"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":"john@gmail.com","createdAt":"2020-06-12T21:15:16.624Z","__v":0},
{"_id":"5ee5e27f1ecd8f05ad764057","name":"Jane","surname":"Doe","email":"jane@gmail.com","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,
};
这对我来说似乎很奇怪,我不确定是什么导致它将数据放入另一个数组中。有人可以看看吗。
解决方案
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
推荐阅读
- javascript - HTML 将 chrome 中的工具提示翻倍
- c++ - 访问冲突读取位置(关键问题)
- postman - 在脚本中更改 URL
- javascript - GETTING ERROR:警告:道具类型失败:提供给“Form”的道具“children”无效,需要一个ReactNode
- java - 调用方法时未按预期给出结果
- flask - 如何在 Flask 中引用图像文件位置?(初学者)
- machine-learning - 深度学习 + ML + CV > Requirements.txt 文件
- php - 有什么方法可以将 $domain 变量默认传递给 route() 方法
- postgresql - 在现有数据库上启用加密 - AWS RDS Postgresql
- python - 即使我已经下载了 Twilio 和 Client,python 也无法导入 Client