DEV Community

Augusto Peressutti
Augusto Peressutti

Posted on

My react app is working in browser but not in my mobile

I'm developing a react app, I want to try some functions in my mobile but when I try to connect to it, I have an error. I understand that is an asynchronus problem... I'm trying to map an (by the moment) undefined array. But I don't understand by in the browser is working well and in my mobile not.

`const eventsFetch = async () => {
const resEvents = await getAllEvents();
const newArray = resEvents.filter((e) => {
const date = new Date(e.date);

return date.getTime() >= Date.now();
});

newArray.sort((e) => e.important === true ? -1 : 1);
setEvents(newArray);
Enter fullscreen mode Exit fullscreen mode

}`

Here is an screenshot from the mobile browser.. I tried with Chrome, Safari and Brave and always I got the same error.

Image description

By last, I already try adding the optional chaining operator to the array, but I have the same result.

If I add a console.log with the result of the array after the filter and the sort, in my computer I can see that it's working fine. Here an image:
Image description

The getAllEvents function:
`export const getAllEvents = async() => {
try{
const req = await fetch(getAllEventsUrl, {
method: "GET",
headers: {
Accept: "application/json",
"Content-Type": "application/json",
"Access-Control-Allow-Origin": "*",
},
credentials: "include",
});

    const response = await req.json();

    if (!req.ok) {
        const error = new Error(response)
        error.status = req.status;
        return error;
    }

    return response;
} catch(error) {
    return error;
}
Enter fullscreen mode Exit fullscreen mode

};`

Discussion (0)