＆＃34;这＆＃34;在我的课程中未定义

Question

我的小型待办事项应用程序存在问题。每次我尝试删除某个项目时都会出现错误Cannot read property 'todos' of undefined

为什么this绑定在addTodo但不绑定removeTodo？

触发器在此处完成：<button onClick={() => removeTodo(id)}> X </button>

JSfiddle上的演示

感谢。

Answer 1

您可以将removeTodo设置为属性初始化箭头函数或使用action.bound装饰器。您还必须使用MobX阵列replace，这样您就不会丢失引用：

removeTodo = (id) => {
  var filtered = this.todos.filter(todo => todo.id !== id);
  this.todos.replace(filtered);
}

或者：

@action.bound
removeTodo(id) {
  var filtered = this.todos.filter(todo => todo.id !== id);
  this.todos.replace(filtered);
}