I have three rows with the component Typography. I want to show the first row, then alternate to the second, then the third, and then back to the first one.
They should be displayed on the same place, and only one at a time.
<Typography>Welcome.</Typography>
<Typography>Willkommen.</Typography>
<Typography>Bem-vindo.</Typography>
const Which = () => {
const [which, setWhich] = useState(1);
useEffect(() => {
setTimeout(() => {
setWhich(state => (state < 3 ? state + 1 : 1));
}, 3000);
}, []);
return (
<div>
{
which === 1 &&
<div>Welcome</div>
}
{
which === 2 &&
<div>Willkommen</div>
}
{
which === 3 &&
<div>Bem-vindo</div>
}
</div>
);
}