Question

我遇到此错误当我尝试运行react js应用程序时，对实验语法'classProperties'的支持当前未启用。

当我单击`

时，我试图在<span>内增加值。

这是关于我的工作的代码段...

 import React, {Component} from 'react';

 export default class Test extends Component {

  constructor(props) {
    super(props);

    this.state = {
      counter: 0
    }
  }

  handleClick = () =>{ //this is where it triggers the error mentioned above
    this.setState((state) => ({counter: state.counter+1}));
  }


  render() {
    return (
      <div>
        <span>{this.state.counter}</span>
        <input type="button" value={this.props.value}
               onClick={this.handleClick} />
      </div>
    );
  }

}

但是我收到此错误当前未启用对实验语法'classProperties'的支持

有人可以帮我吗？

Answer 1

您必须小心JSX回调中的含义。在JavaScript中，默认情况下不绑定类方法。如果忘记绑定this.handleClick并将其传递给onClick，则在实际调用该函数时将无法定义它，因此您需要在构造函数中编写以下代码

  constructor(props) {
    super(props);

    this.state = {
      counter: 0
    }
    this.handleClick = this.handleClick.bind(this);
  }

如何解决问题当前未启用对实验语法“ classProperties”的支持

1 个答案: