Home > Net >  React Native AsyncStorage ')' to end a compound expression
React Native AsyncStorage ')' to end a compound expression

Time:12-05

I am getting this error in my react-native app.

Unexpected JS Expection: Unexpected identifier '_asyncStorage'. Expected ')' to end a compound expression.

This couold be simply a syntax problem but I could not figure it out.

I am fairly new to the framework and trying to implement Redux for user login and registration functions. As I cannot use localStorage, I am using AsyncStorage but I am not really familiar if I can simply somehow replace my localstorage functions with AsyncStorage. I already completed the web app version of the same app. I think there is something wrong with my store.js file for Redux. Here it is if you can help with the error

import thunk from "redux-thunk";
import { userLoginReducer, userRegisterReducer } from './src/redux/reducers/userReducers';
import AsyncStorage from '@react-native-async-storage/async-storage';

const reducer = combineReducers({
    //contains reducers
    userLogin: userLoginReducer,
    userRegister: userRegisterReducer
});

// const UnparsedUserInfo = await AsyncStorage.getItem("userInfo");
// const ParsedUserInfo = await AsyncStorage.getItem("userInfo");

const userInfoFromStorage = await AsyncStorage.getItem("userInfo") ? await AsyncStorage.getItem("userInfo") : null;

const initialState = {
    userLogin: {userInfo: userInfoFromStorage}
};

const middleware = [thunk];

const store = createStore(
    reducer,
    initialState,
    applyMiddleware(...middleware)
);

export default store```

CodePudding user response:

You are trying to await outside of an async scope. You can't await like that. You need to have an async function to handle your promises and save your returned data in a state then you can use this state in your expressions, such

    const [userInfoState, setUserInfoState] = useState(null);

    const getUserInfoAsync = async () => {
          const userInfo = await AsyncStorage.getItem('userInfo');
          setUserInfoState(userInfo);
    };

    useEffect(() => {
      getUserInfoAsync();
    }, []);

    const initialState = {
      userLogin: {userInfo: userInfoState}
    };
  • Related