Random with gastsby and react

The Problem:

On our website we have a carousel that should show items of a randomly sorted array.

The problem now was, that text was displayed of the randomly chosen element during runtime. But the attributes of a tag had the value of the randomly chosen element of the build time of gatsby.

That behaviour led to inconsistent ctas. That means that a link of “Bereit für die Informations-Drehscheibe der Zukunft?” pointet to ‘calendly’ instead of ‘/hub’.

The solution:

Add the randomly sorted array to the local state of the class in componentDidMount and read it from there later on.