Question

在我的本地本机应用程序中，我有一个函数，当用户按下使用setState的按钮（handleButtonAPressed）时，我试图用以下代码将其绑定到构造函数中

const handleButtonAPressed = () => {
  this.setState({x: this.state.x + 1});
}

export default class SvgExample extends React.Component {

  constructor(props) {
    super(props);
    this.state = { x: 0, y: 0 };
    this.handleButtonAPressed = this.handleButtonAPressed.bind(this);
  }

  render() {
    return (
      <View>
        <RoundButton onPress={handleButtonAPressed} />
      </View>
    );
  }
}

但是，我遇到了错误：

'TypeError：未定义不是对象（正在评估'_this2.handleButtonAPressed.bind）

Answer 1

handleButtonAPressed应该在您的班级内，这样您就可以this.handleButtonAPressed.bind(this)了。如果您的班级内没有handleButtonAPressed，则this.handleButtonAPressed将是undefined，不可能做.bind。

这是您应该做的

export default class SvgExample extends React.Component {

  constructor(props) {
    super(props);
    this.state = { x: 0, y: 0 };
    this.handleButtonAPressed = this.handleButtonAPressed.bind(this);
  }

  handleButtonAPressed() {
    this.setState({x: this.state.x + 1});
  }

  render() {
    return (
      <View>
        <RoundButton onPress={handleButtonAPressed} />
      </View>
    );
  }
}

为什么我在构造函数中的绑定不起作用？

1 个答案: