I have a table where I need to make a list of input elements. They will have a default value and you can change their value from max number(default value) to 0 or send this maxNumber. Next to input elements is send button. The Button will get value from the input element and send it to API. Here is part of my code:
const [valueInput,setValueInput]=React.useState(0);
{array.map((x) => (
<TableRow
key={x.id}
>
<TableCell>{x.maxNumber}</TableCell>
<TableCell>
<input
key={x.id}
value ={valueInput}
onChange={ event => {
setValueInput(event.target.value);
parseInt(event.target.value,valueInput)
}}
type="number"
min="0"
max= {x.maxNumber}
/>
<IconButton
key={x.id}
onClick={() => {
team.setTeamNumber(x.id,valueInput);
}}>
<Check />
</IconButton>
</TableCell>
</TableRow>
))}
Can anyone help me how to set valueInput to be x.maxNumber - from the array, or any advice on how can I solve this without useState.