Iam new to React and I got some problems.
This is my current API call.
Axios.post(Addr_currentRound_addOne, { gameId: gameId }).then(history.push("/leiter_tunierplan/"+gameId));
And this is the corresponding API Code snippet.
app.post("/currentRoundAddOne", (req, res) => {
const gameId = req.body.gameId;
db.query(
"UPDATE tunierplan SET currentRound=currentRound+1 WHERE id=?;",
[gameId],
(err, result) => {
if (err) {
console.log(err);
} else {
res.send("Daten Übertragen");
}
}
);
});
The problem here: currentRound, should allways when the call is executed increased by +1. And then Redirect to the given "/leiter_tunierplan/" BUT From time to time, it does not work. Its not increasing it by any Value (+1) My first thought is: Because its async it my be canceled from the history.push, befor it got completed. Am i right? And how can i fix it. Thanks allready.
Is game gameId the already incremented id for the next page? I don't see it being incremented anywhere in your code.
If so, try putting history.push in a callback, like this:
...then(() => history.push("/leiter_tunierplan/"+gameId));
This is because then takes a callback function as a parameter
The Solution to all is to add preventDefault();
My Problem was, that the side got reloaded..
I think you try async-await as the request to the database is promise-based.
My suggestion:
app.post("/currentRoundAddOne", async (req, res) => {
const gameId = req.body.gameId
const data = await db.query("UPDATE tunierplan SET currentRound=currentRound+1 WHERE id=?;", [gameId],
(err, result) => {
if (err) console.log(err);
}
console.log(data) // check updated data, it should return id
})
I hope it works!