Error using async/await in React Native

MusicMan picture MusicMan · Apr 10, 2016 · Viewed 78k times · Source

When trying to use async/await in react-native, I am getting the following error:

    uncaught error Error: SyntaxError: /Users/senthilsivanath/Documents/MusicTulip/index.ios.js: Unexpected token (50:23)
  48 |   renderScene: function(route,nav) {
  49 |     try {
  50 |          const response = await signIn.isLoggedIn();

My .babelrc file is:

{ "presets": ["react-native", "es2015", "babel-preset-stage-3"] }

Answer

radiovisual picture radiovisual · Apr 10, 2016

You might just be missing the async keyword on line 48.

Update your code to use the async keyword before the function keyword:

renderScene: async function(route, nav) {
    try {
        const response = await signIn.isLoggedIn();
        // ...

Or when using an arrow function, put the async keyword before the parameter list:

 renderScene: async (route, nav) => {
        try {
            const response = await signIn.isLoggedIn();

In JavaScript, the async keyword is a decorator that warns the runtime that the attached enclosure will use the await keyword, so you always see them used together. Which is why you will hear people refer to this syntax as the async/await syntax.

Simply put: You can't use await without async.

Edit: If you are declaring this inside of a class, then just be sure that your syntax is correct:

class MusicTulip extends Component {
    async renderContent() {
        const response = await signIn.isLoggedIn();
    }
 }

Hope this helps!