score:4

Accepted answer

that's the problem.

this.state = {
   currentindex: parseint((math.random()*10))%5,
};

this will be invoked on a server and in the browser causing a mismatch in rendered markup.

you could fix that by making sure random will only be called in a browser:

this.state = {
  currentindex: 0,
};

componentdidmount(){
  this.setstate({ currentindex: parseint((math.random()*10))%5 })
}

score:0

using react's usestate and useeffect hook introduced in react 16.8.0:

const [selectedimage, setimage] = usestate(<defaultimage>);
useeffect(() => { 
    setimage(randomimage());
}, [selectedimage]);

Related Query

More Query from same tag