Запуск onChange, для которого требуется событие через программно измененный ввод
Мою проблему лучше всего объяснить на примере кода:
<input type = "text" value = {this.state.a} onChange = {this.setA} /> // inputA
<input type = "text" value = {this.state.b} onChange = {this.setB} /> // inputB
setA(e) {
this.setState({a: e.target.value});
}
setB(e) {
this.setState({b: e.target.value});
// at this point, the inputA.value changes due to state change
setA(???) // update the state with inputA's new value
}
Я хочу установить this.state.a на новое значение, хранящееся в inputA, однако мне нужно вызвать метод setA() вручную, потому что входное значение изменяется программно. Проблема в том, что мне нужно передать inputA, чтобы я мог получить новое значение.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 3
Потому что вы не передаете значение на вход
<input type = "text" value = {this.state.a} onChange = {this.setA} />
<input type = "text" value = {this.state.b} onChange = {this.setB} />
Я обновил исходный пост, чтобы отразить его ближе к моему реальному делу.
Замените метод onChange на onChange = { () => {this.setB}}. Это будет работать..
Как это помогает установить значение a в inputA.value после вызова setB()? Для справки, я опустил код, связывающий this с методами.
Вам также необходимо изменить объявление второй функции onChange = { () => {this.setA}}
Вопрос выше показывает controlled используемые входы. Все в рендере зависит от state или props. Нет определенного способа обновить состояние. Как и в этом случае, вы полагаетесь на событие change для обновления state A, в то время как ваша логика предполагает, что state a также зависит от state b. Итак, ваша функция setB должна выглядеть примерно так:
setB(e) {
const b = e.target.value;
let a = this.state.a; // gives your the current value of a, which is also present in the state
// do calculations to determine your new A
// Then set your state like below
this.setState({b, a }); // Both your inputs would reflect the new values in the state
}
Даже если вы не установите значение a в setB, input a сохранит свое старое значение.
Это не решает проблему обновления
this.state.aв первую очередь при изменении значенияinputB. Я отредактировал сообщение с большей ясностью.