Можно ли при обработке события submit формы, узнать введённые данные?

Question

[KirylLapouski]

Форма находится в реакт компоненте.

Answer 1

[Антон Спирин]

class Example extends Component {
  state = {
    inputValue: '',
  };

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

  handleSubmit = e => {
    e.preventDefault();
    //  получить состояние формы можно обратившись к this.state
  };

  render() {
    const { inputValue } = this.state;

    return (
      <form onSubmit={this.handleSubmit}>
        <input
          name="inputValue"
          value={inputValue}
          onChange={this.handleChange}
        />
        ...
      </form>
    );
  }

Answer 2

[ThemeZV]

Очень советую для форм использовать formik или formsy
В формси на onSubmit как раз передается функция, принимающая модель - объект с данными формы.

Answer 3

[Максим]

Конечно, можно!
Все что есть на странице - может быть вытянуто через JS. Будь то это нативный запрос, типа getElementById или обработка заранее приготовленного стейта, или доступ по ref ссылке...

p.s. вопрос не самый корректный, нужно больше деталей.

Answer 4

[Илья Канышев]

Конечно можно!
Если вытащить из формы, потребуется дать форме имя.
Так вытащить данные из поля name формы kek нужно будет использовать такой код:
var data = kek.name.value

Answer 5

[Артем Спиридонов]

На jQuery

$('form').on('submit', function() {
var data = {};
$('form input').each(function() {
data[$(this).attr('name')] = $(this).val();
});
});

console.log(data);