Блог

Главная - Вопросы по программированию - Добавление минимума наряду с максимумом для функции ограничения выбора флажка в ReactJS

Добавление минимума наряду с максимумом для функции ограничения выбора флажка в ReactJS

#javascript #reactjs #checkbox #ecmascript-6 #radio-button

#javascript #reactjs #флажок #ecmascript-6 #переключатель

Вопрос:

У меня есть приложение react, которое сопоставляет значения JSON с флажками, а JSON включает минимальное / максимальное требуемое значение, я создал функцию, которая устанавливает максимальное значение для флажков из JSON, и она работает нормально, но всякий раз, когда я пытаюсь добавить минимум к тем же функциям, это не работает, я пробовал такие вещи, как (this.props.min <this.state.currentData < this.props.max ), но это не сработало

Checkboxes.js Максимальная функция

 ....
selectData(id, event) {
    let isSelected = event.currentTarget.checked;
    if (isSelected) {
      if (this.state.currentData < this.props.max) {
        this.setState({ currentData: this.state.currentData   1 });
      } else {
        event.preventDefault();
        event.currentTarget.checked = false;
      }
    } else {
      this.setState({ currentData: this.state.currentData - 1 });
    }
  }

....

Полный код: https://codesandbox.io/embed/wklrxy5x15?fontsize=14

Ответ №1:

Вы добавляете 2 проблемы в свой код:

  1. Вы забыли передать минимальные реквизиты своему Checkbox компоненту (из ItemList )
  2. Условие, при котором вы сняли флажок, было не совсем правильным

Смотрите рабочий пример здесь: https://codesandbox.io/s/mjp92vkj9x