如何定義事件處理程式：handleStatus 型別：MouseEventHandler，以便我可以將型別的附加引數：Todo 傳遞給函式？
interface TodoProps {
todos: Array<Todos>
handleStatus: MouseEventHandler,
index: number,
className: string
}
export const Todo: FunctionComponent<TodoProps> = ({ todos, handleDeleteTodo, handleStatus, index, className }): ReactElement => {
const d_todo: Todos = todos[index];
return(
<>
<div className= { className } key={ todos[index].id.toString() }>
{todos[index].describtion}
<Button lable='' disabled= { false } onClick= { () => handleStatus(todos[index]) } />
</div>
</>
);
}
我得到了錯誤：
ERROR in src/components/Todo.tsx:29:84
TS2345: Argument of type 'Todos' is not assignable to parameter of type 'MouseEvent<Element, MouseEvent>'.
Type 'Todos' is missing the following properties from type 'MouseEvent<Element, MouseEvent>': altKey, button, buttons, clientX, and 29 more.
27 | <div className= { className } key={ todos[index].id.toString() }>
28 | {todos[index].describtion}
> 29 | <Button lable='' disabled= { false } onClick= { () => handleStatus(todos[index]) } />
| ^^^^^^^^^^^^
30 |
31 | </div>
32 | </>
uj5u.com熱心網友回復：
If you need to pass both event MouseEvent and both Todo then you need to declare handleStatus as a function that accept an event and a Todo:
handleStatus: (event: MouseEvent, todo: Todo) => void
then in the component:
onClick={(event) => handleStatus(event, todos[index])}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/447828.html