ReactJS：未捕获的类型错误：this.props。 不是函数

Question

I have two react-components. Parent component has a function handleOnChangeTaskCategory which is used like props in child component. Parent component:

 export default class TodoList extends React.Component{ constructor(props) { this.handleOnChangeTaskCategory = this.handleOnChangeTaskCategory.bind(this); } handleOnChangeTaskCategory(taskList) {// } render() { return ( <div className="row">{ this.state.toDoList.map(taskList => { return <TaskGroup onEditTaskCategory={this.handleOnEditTaskCategory} /> }) } </div> ); } }

And children component:

 export default class TaskGroup extends React.Component { constructor(props) { this.handleOnAddTask = this.handleOnAddTask.bind(this); } handleOnAddTask() { this.props.onEditTaskCategory(update(this.props.listOfTasks, { tasks: { $push: newTask } })); } render() { return ( <a href="#" onClick={this.handleOnAddTask}>Add task</a> ); } }

But when I click "Add task", I have an error

Uncaught TypeError: this.props.onEditTaskCategory is not a function at TaskGroup.handleOnAddTask

Answer 1

class method -> handleOnChangeTaskCategory method passed to component property -> handleOnEditTaskCategory

你有错字