Class property initializer with async function arrow: event.preventDefault is not a function

I have this construct:

class Form extends React.Component {
  // ...
  handleSubmit = async (e) => {
    e.preventDefault();
  }
  // ...
  render() {
    return (
      <button onClick={this.handleSubmit}>Register</button>
    );
  }

but e.preventDefaultit is not recognized there:

If I delete async, it will work.

EDIT:

I found that the first argument in the case asyncis thisinstead of an event. It also works correctly:

handleSubmit = (e) => this._handleSubmit(e);

async _handleSubmit (event) {
  event.preventDefault();
}

This must be the wrong intervention asyncand initializer of class properties in Babel

Babylon:

Any suggestions?

EDIT2:

See also: https://github.com/gaearon/react-hot-loader/issues/391

+4
source share

No one has answered this question yet.

Source: https://habr.com/ru/post/1668966/


All Articles