Actually i want to show this Names in a sequence but whenever i click increment button the order ( in useState ) increment by 1 but when i click decrement button first time the order again increment by 1 and then is less than one.
function func() {
let [getVal, setVal] = useState({
alerts: "no alerts",
order: 0,
});
let Names = [
"Default",
"Evil laugh",
"classic alarm",
"Pause",
"intro music",
"Got item",
"Old bounce",
"bark",
"alarm tone",
];
function slider(e) {
let { order } = getVal,
value = e.target.id,
total = Names.length;
if (value === "up" && order !== total - 1) {
setVal((rest) => ({ ...rest, order:order + 1 }));
} else if (value === "down" && order !== 0) {
setVal((rest) => ({ ...rest, order: order - 1 }));
}
setVal((rest) => ({ ...rest, alerts: Names[order] }));
}
return (
<>
<button
onClick={slider}
id="up"
>
up
</button>
<p>
{getVal.alerts}
</p>
<button
onClick={slider}
id="down"
>down
</button>
</>
)
}