Question

我目前正在尝试使用react-native和redux创建一个“ TodoApp”。我可以在其中添加和切换工作的不同部分，但似乎无法正确设置可见性过滤器（显示全部/完成/活动）。

这是TaskListContainer的相关代码：

import { connect } from 'react-redux';
import TaskListComponent from '../components/TaskListComponent';
import {visibilityFilters} from "../actions/actionTypes";

const getVisibleTodos = (tasks, filter) => {
switch (filter) {
    case visibilityFilters.SHOW_ALL:
        return tasks;
    case visibilityFilters.SHOW_COMPLETED:
        return tasks.filter(t => t.completed);
    case visibilityFilters.SHOW_ACTIVE:
        return tasks.filter(t => !t.completed);
    default:
        return null;
}
}

const mapStateToProps = (state) => {
return {
    //tasks: !state.taskReducers ? [] : state.taskReducers
    tasks: getVisibleTodos(state.tasks, state.visibilityFilter)
};

};

const TaskListContainer = connect(mapStateToProps, null)(TaskListComponent);
export default TaskListContainer;

如果初始状态为“ SHOW_ALL”，则该应用程序正在运行，但是每当我添加新项目时，它都不会显示。如果状态切换为“ SHOW_COMPLETED”或“ SHOW_ACTIVE”，则应用程序将崩溃：“无法读取未定义的属性'filter'”。

我看过/读过的每个教程都使用此“ getVisibleTodos”功能，并且可以正常工作。为什么不给我呢？

Answer 1

我已解决此问题。我没有将getVisibleTodos函数放入 Container 中，而是将其放入 Component 中，而是在从商店中获取数据之后过滤了数据，而不仅仅是获取了我正在使用。它效率低一些，但可以。

Answer 2

实际上，我认为没有必要这样做，因为我已经将其移至TaskListContainer了，可以按预期运行，请参见此处：https://codesandbox.io/s/1ok4k5vro3

React-Native可见性过滤器不起作用？

2 个答案: