After coding a component in React using Typescript, I encountered an issue
Within the interface, all prop types are defined for reference.
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { Task } from './Models';
export class TaskTable extends React.Component<TableProps, any> {
constructor(props: TableProps){
super(props);
}
render() : JSX.Element {
console.log('came inside render method');
return (
<div>
{this.props.taskList.map((t: Task, index: number) =>
<div key={t.taskid}>
<span>{t.taskvalue}</span>
<button onClick={this.props.handleDelete(index)}>Delete</button>
</div>
)}
</div>
);
}
}
interface TableProps {
taskList: Array<Task>
}
The specific challenge lies in defining the type of handleDelete within my TableProps interface
<TaskTable taskList=[{taskid: 1, taskvalue: 'foo'}] handleDelete={this.handleDelete} />
In what way can I declare the type of handleDelete correctly?