试图使列表项通过onClick删除，但它破坏了我的提交按钮

Question

我正在使用react和redux制作一个任务列表程序，并且编写了一个函数，当您单击项目并将其添加到第二个列表中但被删除时，将其从列表中删除。我试图使该函数在每个列表项上触发onClick，但是由于某种原因，当我向其中添加事件时，当我单击“提交”按钮以添加新任务时，页面上的所有内容都消失了。我已经尝试过其他事件，例如onMouseDown，它们都引起了同样的事情。我尝试更改代码的各个部分，但似乎唯一的中断是添加onClick事件。处理列表删除的功能在这里const taskReducer = (state = [[],[]], action) => {    switch(action.type) {        case ADD:             return [state[0].concat(action.task), [...state[1]]];        case COMP:            let idx = indexOf(state[0].filter(action.task));            let beg = state.slice(0, idx);            let end = state.slice(idx + 1);            let newState = [[...beg, ...end], [...state[1], action.task]];            return newState;        default:             return state;    }}生成按钮和两个列表的部分在这里<button    id = 'submitGoal'   onClick = {this.submitHandler} >Submit</button><ul id = 'currentTasks'>   {this.props.tasks.map( (task, idx) => {        return (             <li onClick = {this.completeHandler(event.target)} key={idx}>{task}</li>             )        })   }</ul><ul id = 'completedTasks'>     {this.props.compTasks.map( (task, idx) => {          return (               <li key={idx}>{task}</li>               )          })     }</ul>整个程序现在也可以在https://jeengland.github.io/molehills/上直播。