RowDataPacket returns empty object but it is not empty [React/Next]

Question

I've been stressing around trying to fix this and I've burnt myself out. I'm calling my serverless mysql trying to get kanbans from teams. I've used this method multiple times and all were working fine but that is most likely because of they only return single item whilst this returns multiple items.

This is my code which returns empty object.

async function getKanbans(team_id){
    let kanbans = [];
    await sql_query(`SELECT id, sName FROM table WHERE iTeam = ?`, [team_id])
    .then(result => {
        result.forEach(kanban => {
            // console.log(kanban);
            kanbans.push({
                id: kanban.id,
                name: kanban.sName
            });
        });
    })
    .catch(err => {
        console.log(err);
    });

    console.log(kanbans);
    return kanbans;
}

As you can see.. I am trying to print kanbans and I do get:

[
  { id: 1, name: 'Kanban_1' },
  { id: 2, name: 'Kanban_2' }
]

of out it. Then I'm trying to return it to the item that called this function and this is how that looks like:

teams.push({
   id : team.id,
   sName : team.sName,
   sColor : team.sColor,
   aKanbans : result[0]['selectedTeam'] == team.id ? getKanbans(team.id) : null,
});

(a small snippet of something bigger)

Okay, so now when I try and look at the data response (from the frontend) I get this:

{
  "success": true,
  "message": "Found teams",
  "teams": [
    {
      "id": 1,
      "sName": "Team1",
      "sColor": "#fcba03",
      "aKanbans": {}
    },
    {
      "id": 2,
      "sName": "Team2",
      "sColor": "#2200ff",
      "aKanbans": null
    }
  ]
}

aKanbans from Team1 is empty, empty object. What the **** do I do? I tried mapping it and still got an empty object. React/javascript is not my main language, I just like to learn. Any suggestions?

Where are you calling `teams.push(...)`? Could you provide the full code of the function where it's used? Also, `getKanbans` is an async function, so you need to `await` for it, i.e. `result[0]['selectedTeam'] == team.id ? await getKanbans(team.id) : null`. — juliomalves, Jan 02 '22 at 11:03
Does this answer your question? [Wait for forEach with a promise inside to finish](https://stackoverflow.com/questions/45082038/wait-for-foreach-with-a-promise-inside-to-finish) — juliomalves, Jan 03 '22 at 10:36

lpizzinidev · Answer 1 · 2021-12-31T09:11:53.210

0

You are mixing async / await function with normal Promises handling.

Try to change your getKanbans code like this:

async function getKanbans(team_id) {
  let kanbans = [];
  try {
    const result = await sql_query(
      `SELECT id, sName FROM table WHERE iTeam = ?`,
      [team_id]
    );
    result.forEach((kanban) => {
      kanbans.push({
        id: kanban.id,
        name: kanban.sName,
      });
    });
  } catch (err) {
    console.log(err);
  }

  return kanbans;
}

And then populate the teams using (declare the parent async):

teams.push({
    id : team.id,
    sName : team.sName,
    sColor : team.sColor,
    aKanbans : result[0]['selectedTeam'] == team.id ? getKanbans(team.id) : null,
 });

edited Dec 31 '21 at 09:11

answered Dec 30 '21 at 13:19

lpizzinidev

12,741
2
10
29

I created a pastebin with the changes you told me to do: https://pastebin.com/TA7g0nRb New error: Error: error: await isn't allowed in non-async function aKanbans : result[0]['selectedTeam'] == team.id ? --> await <-- getKanbans(team.id) : null, Any ideas? – Lato Dec 30 '21 at 13:34
Try to remove the `await` before the `getKanbans` function call – lpizzinidev Dec 31 '21 at 09:12
It still returns aKanbans: Object {} :( – Lato Dec 31 '21 at 09:50

RowDataPacket returns empty object but it is not empty [React/Next]

1 Answers1