首页 > 解决方案 > 我从 API 获取数组,但是当我尝试在表中显示它时它显示空数组(noob ReactJs)

问题描述

我创建了一个 Be api 我存在一个 Get 请求以从该 API 获取所有任务, 在此处输入图像描述

{
"tasks": [
    {
        "_id": "5f0b19c11f072e0984459ff5",
        "title": "some Edited random stuff ",
        "description": "some Edited random stuff",
        "creater": "vladi",
        "__v": 0
    },
    {
        "_id": "5f0b19d71f072e0984459ff6",
        "title": "vladi task ",
        "description": "vladi description",
        "creater": "vladi",
        "__v": 0
    }  ]

在我的 TaskReducer 中,我做到了

tasks: {
  tasks: []
  },

现在在我的首页中,我要求在表格中查看所有内容

 <tbody>
                    {this.props.tasks.tasks.map((task, taskID) =>
                        <tr key={taskID}>
                            <th scope="row" >  2{task.title}</th>
                            <td >3{task.description}</td>
                            <td >4{task.creater}</td>
                            <td >5{task.dateCreated}</td>

                            <td >
                                <span className="pointer" onClick={() => this.handlerClickDeleteTask(task.taskID)}>delete  </span>
                                <span className="pointer" onClick={() => this.handlerClickViewTask(task.taskID)}>edit  </span>
                                <span className="pointer" onClick={() => this.handlerClickEditTask(task.taskID)}>view  </span>
                            </td>
                        </tr>

                    )}

                </tbody>

但是当我打开表格时它看起来是空的(甚至没有显示那里的数字)如果有人有想法或认为需要更多 https://github.com/VladiKonovalov/Fronted/blob/master/src/ ,这是存储库的链接容器/Tasks.js

标签: javascriptarraysreactjsmongodbreact-redux

解决方案


usersActions.js文件下,您正在设置用户而不是任务。

case "SET_TASKS":
    state = { ...state, users: action.payload }
    break;
default:

它应该是这样的:

case "SET_TASKS":
    state = { ...state, tasks: action.payload }
    break;
default:

推荐阅读