React async and await throwing error 'Uncaught ReferenceError: regeneratorRuntime is not defined'

Question

I have this bit of code

async makeRestCall() {
    var api = await PrognApi(this.state.Name);
    console.log(api);
  }

but react is throw this

Uncaught ReferenceError: regeneratorRuntime is not defined

in the console. I know I've used async and await before with React but I can't remember how I think I had to install a library. Any advice would be great. I'm using a js file to hold my jsx. I'm using webpack and babel as well.

Answer 1

I'm not sure what "regeneratorRuntime" is, so maybe the problem is elsewhere. But I saw a few things.

First, it looks like you're missing the opening bracket for your method:

async makeRestCall() {
  var api = await PrognApi(this.state.Name);
  console.log(api);
}

Second, is Name with a capital "N" correct?

Third, I wonder if your method has the this context? Maybe it's having trouble accessing your component's state . You could try changing it to an arrow function:

makeRestCall = async () => {
  var api = await PrognApi(this.state.Name);
  console.log(api);
};

I don't feel like I have enough information to troubleshoot this. Maybe update your question to show the entire component?

Good luck!

Answer 2

原来我需要Babel-polyfill