javascript - 反应：未捕获的类型错误：无法读取未定义的属性“删除”

Question

我的代码有问题：

class Note extends React.Component{
  constructor(props){
    super(props);
  }
  xoa(){
    var {index, handleRemove} = this.props;
    handleRemove(index);
  }
  render(){
    return(
      <div>
        <p>{this.props.children}</p>
        <button onClick={this.xoa.bind(this)}> Delete </button>
      </div>
    );
  }
}

class List extends React.Component{
  constructor(props){
    super(props);
    this.state = {
      arrayNote: ['ha', 'hi', 'hu']
    };
  }
  remove(index){
    this.state.arrayNote.splice(index, 1);
    this.setState(this.state);
  }
  render(){
    this.remove = this.remove.bind(this);
    return(
      <div>{this.state.arrayNote.map(function(note, i){
          return (<Note index={i}
            handleRemove={this.remove}
            key={i}>{note}</Note>)
        })}
      </div>
    );
  }
}

ReactDOM.render(
  <List />,
  document.getElementById("root")
);

<div id="root"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.11.0/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.11.0/umd/react-dom.production.min.js"></script>

在控制台中显示： TypeError: Cannot read property 'remove' of undefined and Uncaught TypeError: Cannot read property 'remove' of undefined 请帮我解决这个问题！谢谢。

标签： javascriptreactjs