Question

我正在尝试创建待办事项列表，但遇到了问题。创建新任务并移回以显示列表时，我看到一个空字段并创建了任务。我发现此空字段是服务器在创建任务后发送的状态。有一种方法可以不显示该字段？

export const fetchtodos = () => async dispatch => {
  const token = localStorage.getItem('token');
  const response = await todosApi.get('/todos', {
    headers: { Authorization: token }
  });
  dispatch({ type: FETCH_TODOS, payload: response.data });
};

这是一个列表组件：

  todosList() {
return this.props.todos.map(function(currentTodo, i) {
  return <TodosList todo={currentTodo} key={i} />;
});

}

 const TodosList = props => (
  <tr>
    <td className={props.todo.completed ? "completed" : "TableText"}>
      <div className="TodoTableContent">
        <Link to={"/edit/" + props.todo._id} className="TodoLinkContent">
          {props.todo.title}
        </Link>
        <Link to={"/delete/" + props.todo._id} className="a_edit">
          <img src={Trash} alt="Usuń" className="Deletefavicon" />
        </Link>
      </div>
    </td>
  </tr>
);

我希望将显示创建的任务。但服务器的状态也显示为未定义 unexpected result img

Answer 1

仅当未定义待办事项时才渲染组件：

{ props.todo && (
  <Link to={"/edit/" + props.todo._id} className="TodoLinkContent">
    {props.todo.title}
  </Link>
  <Link to={"/delete/" + props.todo._id} className="a_edit">
    <img src={Trash} alt="Usuń" className="Deletefavicon" />
  </Link> )
}

我怎样才能只获取没有状态的数据？

1 个答案: