Javascript 如何重复筛选数组？

所以，现在我正在制作任务列表，我对“活动”和“完成”任务的按钮有问题。当我按下其中一个按钮时，它必须返回已完成/活动的任务，并返回，但仅返回1次。我猜它会生成一个新数组，并删除旧数组。那么，如何制作过滤器，它不会删除我的阵列，而只是过滤已完成或活动的任务？每次我点击这些按钮，我都会看到在“完成/活动/全部”上过滤的任务

顺便说一句，对不起

---

我建议你采用不同的方法。

---

在按钮单击功能中，您可以获取所有TODO并返回已过滤出的TODO，这些TODO是活动/完成的，而不是在reducer上执行操作。

下面是一个如何存储本地状态并将其作为props.done传递给ConnectedList的示例

ConnectedList将selectFilteredTasks作为mapStateToProps创建，这是一个用于获取任务的选择器，此函数的第二个参数是props，因此如果未定义props.done，它将过滤掉已完成的任务

const{useState}=React；
常数{
供应商，
连接
}=反应次数；
const{createStore}=Redux；
const{createSelector}=重新选择；
常量状态={
任务：[
{
id:1，
任务:"一",，
状态：false，
},
{
id:2，
任务:"两个",，
状态：正确，
},
],
};
const store=createStore(
（x） =>x，//不会分派任何操作
{…州}，
窗口。\uuuu REDUX\u DEVTOOLS\u EXTENSION\uuuu&&
窗口。\uuuu REDUX\u开发工具\u扩展
);
//选择器
const selectTasks=（state）=>state.tasks；
常量selectFilteredTasks=createSelector(
选择任务，
（{done}）=>done，//获取传递给selectFilteredTasks的第二个参数
（任务，完成）=>
完成！==未定义
? {
任务：tasks.filter(
（任务）=>task.status===完成
),
}
：{tasks}
);
常量列表=（{tasks}）=>(

{tasks.map（（任务）=>(

{JSON.stringify（任务）}

))}

);
const ConnectedList=connect（selectFilteredTasks）（列表）；
常量应用=（）=>{
const[done，setDone]=useState（）；
返回(
只做
setDone（完成？未定义：true）}
>
);
};
ReactDOM.render(
,
document.getElementById（'root'））
);

在调度
活动任务时，删除所有非活动任务。也许用过滤器保存本地状态，并将过滤器函数传递给选择任务的选择器函数。我不知道如何做。我知道，这太愚蠢了：（您是否使用react-redux connect或react-redux useSelector获取组件的非状态信息？是的，我正在使用react-redux connectI将创建一个示例С，您可以告诉我更详细的方法吗？@БББГааЧбббббб，上述示例是否有效？如果不起作用，请创建您的模板，以便我们可以准确地知道您的位置。）面对问题
onst ADD_TASK = 'ADD_TASK'
const EDIT_STATUS = 'EDIT_STATUS'
const TASK_DELETE = 'TASK_DELETE'

const DONE_TASK = 'DONE_TASK'
const ACTIVE_TASKS = 'ACTIVE_TASKS'




const initialState = {
    tasks: []
};


const mainReducer = (state = initialState, action) => {
    switch (action.type) {

        case ADD_TASK: {
            return {
                ...state,
                tasks: [{
                    id: shortid.generate(),
                    task: action.task,
                    status: false
                }, ...state.tasks], filter: 'all'
            }
        }

        case EDIT_STATUS: {
            return {
                ...state,
                tasks: state.tasks.map(task => task.id === action.id ? {...task, status: !task.status} : task)
            }
        }

        case TASK_DELETE: {
            return {
                ...state,
                tasks: state.tasks.filter(t => t.id !== action.id)
            }
        }

        case DONE_TASK: {
            return {
                ...state,
                tasks: state.tasks.filter(t => !t.status),
                filter: 'done'
            }
            return state.tasks
        }


        case ACTIVE_TASKS: {
            return {
                ...state,
                tasks: state.tasks.filter(t => t.status),
                filter: 'active'
            }
            return state.tasks
        }

    default:
        return state
    }
}

export const doneTask = () => ({type: 'DONE_TASK'})
export const activeTask = () => ({type: 'ACTIVE_TASKS'})




export const addTask = task => ({type: 'ADD_TASK', task});
export const editStatus = id => ({type: 'EDIT_STATUS', id})
export const deleteTask = id => ({type: 'TASK_DELETE', id})


export default mainReducer;