async-arrow-loader

yarn add async-arrow-loader --dev

We recommend using yarn, but you can also still use npm:

npm install --save-dev async-arrow-loader

Within your webpack configuration object, you’ll need to add the async-arrow-loader to the list of modules, like so:

module: {
  rules: [
    {
      test: /\.js$/,
      loader: 'async-arrow-loader',
      exclude: /(node_modules|bower_components)/
    }
  ]
}

In the ES6, if you want to use the Arrow function and async and await together, just like this:

—-Old way:—-

handleSubmit = () => {
    this.props.onSubmit()
        .then(() => {
            //do something here ...., after the promise resolve
        })
}

—-New way:—-

handleSubmit = async () => {
    await this.props.onSubmit()
    //do something here ...., after the promise resolve
}

If you want to get the Promise response data, you can write like this:

—-Old way:—-

handleSubmit = () => {
    this.props.onSubmit()
        .then((data) => {
            dosomething(data)
            //do something here ...., after the promise resolve
        })
}

—-New way:—-

handleSubmit = async () => {
    let data = await this.props.onSubmit()
    dosomething(data)
    //do something here ...., after the promise resolve
}

If you want to catch the reject status:

—-Old way:—-

handleSubmit = () => {
    this.props.onSubmit()
        .then((data) => {
            dosomething(data)
            //do something here ...., after the promise resolve
        }).catch((error) => {
            // do somethind after the promise reject
        })
}

—-New way:—-

handleSubmit = async () => {
    try{
        let data = await this.props.onSubmit()
        dosomething(data)
        //do something here ...., after the promise resolve
    } catch (e) {
        // do somethind after the promise reject
    }
}