Я использую хук useState и имею множество условий
const [conditions, setConditions] = useState([])
Каждый элемент в этом массиве содержит {условие: "какая-то строка", значение: логическое значение}
Я визуализирую свой массив следующим образом:
<FormControl component = "fieldset">
<FormGroup aria-label = "position" column className = {classes.form}>
{conditions.map(({ condition, value }, index) => {
return (
<FormControlLabel
key = {index}
value = "end"
control = {
<Checkbox
checked = {value}
onClick = {() => {
changeConditionValue(index, !conditions[index].value);
}}
/>
}
label = {condition}
labelPlacement = "end"
/>
);
})}
</FormGroup>
</FormControl>
Теперь я пытаюсь изменить значение условия по определенному индексу, если вы нажмете прикрепленную к нему галочку, и я настроил ее следующим образом:
const changeConditionValue = (findIndex, newValue) => {
const saveConditions = conditions;
setConditions([]);
saveConditions.map(({ condition, value }, index) => {
if (index != findIndex) {
setConditions((old) => [...old, { condition, value }]);
} else {
setConditions((old) => [...old, { condition, newValue }]);
}
});
};
Сначала я сохраняю старые условия, потому что, если я продолжу использовать "... old", значения старого массива будут сохранены, и я не хочу этого, поэтому у меня есть свои saveConditions, где я сопоставляю, чтобы установить эти значения к моему новому набору условий. Все работает нормально, за исключением того, что я делаю это более одного раза. В первый раз значение возвращается обратно, но во второй раз оно возвращает undefined ?
This is the error: Material-UI: A component is changing the controlled checked state of SwitchBase to be uncontrolled.
Elements should not switch from uncontrolled to controlled (or vice versa).
Decide between using a controlled or uncontrolled SwitchBase element for the lifetime of the component.
The nature of the state is determined during the first render, it's considered controlled if the value is not `undefined`.
```
Нет, не совсем :/



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Неважно, я исправил это сам:
setConditions((old) => [...old, { condition, value: newValue }]);
не работает!
Отвечает ли это на ваш вопрос? Компонент изменяет неконтролируемый ввод текста на управляемую ошибку в ReactJS