@w1kenD

Как синхронизовать slider и поля input в React?

Добрый день, недавно начал изучать React. Основная суть задачи: нужно синхронизовать все поля между собой так, чтобы они все обновлялись. Столкнулся с проблемой, что если делать ввод в поля Input (начало и конец), то слайдер ломается и не обновляется. А еще в консоли появляется ошибка. Есть идея использовать хук useEffect для обновления слайдера, при введении новых данных в полях input, но ничего не получилось. Помогите пожалуйста советом!

610a1d81003e4306441256.png

Код: https://codepen.io/nolikdm/pen/BaRPrzL
  • Вопрос задан
  • 70 просмотров
Решения вопроса 1
Seasle
@Seasle
\( ゚ヮ゚)/
Для начала изменить функции:
const handleIndicatorChangeOne = (event) => {
  setValue(values => [Number(event.target.value) || '', values[1]]);
};

const handleIndicatorChangeTwo = (event) => {
  setValue(values => [values[0], Number(event.target.value) || '']);
};

Раз Вы храните массив, то и устанавливайте новым значением массив.
Далее - onChange у TextField необходимо поменять на handleIndicatorChangeOne и handleIndicatorChangeTwo.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы