<form onSubmit={this.handleSubmit}>

<TextField style={{width: '100%'}}
id="standard-name"
label="Имя"
margin="normal"
value={this.state.name}
onChange={this.handleChangeName}
/>

<TextField style={{width: '100%'}}
id="lastName"
label="Фамилия"
margin="normal"
value={this.state.lastName}
onChange={this.handleLastName}
/>



<input type="submit" value="Отправить" />
</form>






Вот такая форма есть, я все поля её обрабатываю отдельным хэндлером, типа таких


handleChangeName(event) {
this.setState({name: event.target.value});

}

handleLastName(event) {
this.setState({lastName: event.target.value});

}




если у меня их 20 штук полей, то для всех нужен отдельный метод или я попутал что-то ? делаю первый раз по доке, не кидайтесь )


по тз мне надо собрать все поля и отправить json на сервак

интуитивно думаю что делаю не так, поэтому решил у опытных узнать, можно ли собрать все значения полей и отпавить jsonом?

Тебе нужен react-final-form

можно делать так handleChange = e => { this.setState({ [e.target.name]: e.target.value }) }

Как вариант ref на форму и создать new FormData(ref), но это если вам никакой стейт в ней не нужно контролировать

https://reactjs.org/docs/uncontrolled-components.html