Всем привет, есть следующий компонент, требуется получить значнеие из всех импутов, но для чекбокса и радио почему-то не работает. Свойство объекта fired вообще отоброжается в браузерной консоли как строка, хотя я явно задавал ее как bool переменую. Подскажите, что не так ?
class SecondWindow extends React.Component{
state = {
id: null,
FIO: "",
position:"",
birthDay: "",
sex: bool,
fired: false
};
handleOptionChange = e => {
this.setState(
{
selectedOption:e.target.value
}
)
}
submitHandler = e => {
e.preventDefault();
console.log(this.state.fired)
}
changeInputHandler = e => {
e.persist();
this.setState(prev=>({...prev, ...{
[e.target.name]: e.target.value
}}))
}
render() {
return (
<form onSubmit={this.submitHandler}>
<div className="input-group mb-3">
<input type="text" className="form-control" placeholder="ФИО"
name="FIO"
onChange={this.changeInputHandler}></input>
</div>
<select className="form-select" aria-label="Default select example"
name ="position"
onChange={this.changeInputHandler}>
<option value="Старший разработчик">Старший разработчик</option>
<option value="Младший разработчик">Младший разработчик</option>
<option value="Эйчар">Эйчар</option>
<option value="Уборщик">Уборщик</option>
</select>
<div className="form-group ">
<div className="mb-3"></div>
<input className="form-control" type="date" id="example-date-input"
name ="birthDay"
onChange={this.changeInputHandler}></input>
</div>
<div className="form-check">
<input className="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1"></input>
<label className="form-check-label" htmlFor="flexRadioDefault1">
М
</label>
</div>
<div className="form-check">
<input className="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1"></input>
<label className="form-check-label" htmlFor="flexRadioDefault1">
Ж
</label>
</div>
<div className="form-check">
<input className="form-check-input" type="checkbox" value="" id="flexCheckDefault"
name ="fired"
onChange={this.changeInputHandler}
></input>
<label className="form-check-label" htmlFor="flexCheckDefault">
Уволен
</label>
</div>
<button type="button" className="btn btn-success" type="submit">Добавить нового сотрудника</button>
<button type="button" className="btn btn-danger" type="submit">Удалить выбранного сотрудника</button>
</form>
);
}
}