Как получить значение в инпута по клику кнопки?

Question

[rsoinvi]

есть код:

<input type="text" />
<input type="submit" value="click" />

Как получить значение инпута по клику без query selector?

Answer 1

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

Тут два пути:
1. Использовать контролируемый input
2. Использовать ref

Answer 2

[Максим]

Контролируемый input

описываете state компонента, в нем поле, пусть будет myValue: '' (пустая строка):

state = {
  myValue: '',
}

далее назначаете onChange у инпута в котором этот стейт меняете. Не забывайте в value инпута положить значение из стейта:

handleChange = (e) => {
  this.setState({ myValue: e.currentTarget.value })
}

<input onChange={this.handleChange} value={this.state.myValue}/>

Итого, в this.state.myValue у вас всегда будет актуальное значение инпута.