ToggleButton Инициализация объекта с динамическими именами свойств - PullRequest
Новая
       6

ToggleButton Инициализация объекта с динамическими именами свойств

0 голосов
/ 14 мая 2018

Когда пользователь переключает кнопки, мне нужно запустить метод handleChange и установить его состояние. Метод handleChange Я инициализирую объект с динамическими именами свойств. Согласно коду, который я написал при печати метода e handleChange, я вижу только значение кнопки, на которую нажал. Как получить ID и Value, чтобы я мог легко установить состояние? 

constructor(props) { 
    this.handleChange = this.handleChange.bind(this);

    this.state = {
        radioToggleButton: 1,

    }
}

handleChange(e){

    this.setState({
        [e.target.id]: e.target.value
    });
    console.log(this.state);
}

... Следующий фрагмент кода взят из метода render (). 

  return(
<form onSubmit={this.savePreference}>
<FormGroup 
    controlId="meatOptionDay1"
    validationState={this.getValidationState()}
  >
        <ButtonToolbar>
            <ToggleButtonGroup className="btn-choice" type="radio" name="stateofRadio" defaultValue={this.state.radioToggleButton} onChange={this.handleChange}>
                  <ToggleButton value={1} >Op1</ToggleButton>
                <ToggleButton value={2}>Op2</ToggleButton>
              </ToggleButtonGroup>
        </ButtonToolbar>
    </FormGroup>

1 Ответ

0 голосов
/ 14 мая 2018

вы можете изменить ваше событие handleChange следующим образом 

handleChange(e) {
        const { name, value } = e.target;
        this.setState({
            [name]: value
        });
    }
...