Реагируйте на ввод нескольких текстов, управляя каждым другим состоянием
Итак, я учусь использовать React и пытаюсь создать приложение для обмена валюты.
У меня проблема с пониманием того, как использовать setState с нескольких входов, в зависимости от того, какой вход вы действительно используете.
Я установил CodePen, чтобы показать вам, что я пытаюсь сделать.
То, что я знаю или не знаю:
Прямо сейчас обновляю только состояние
tempValue.Если я использую первое поле ввода, это дает желаемый эффект.
2.1 Я знаю, что в этом случае я не обновляю состояния, я просто делаю свои вычисления прямо на опоре значения (но это работает, чтобы показать мое намерение).
2.2 Я не знаю, следует ли мне проводить вычисления на
setStateили по отдельному методу.2.3 Я, вероятно, могу использовать таймер ожидания и искать onKeyDown, а затем
setState.Я, наверное, мог бы использовать неконтролируемые компоненты, но это был бы не способ React (это плохо).
Мой
setStateизначально использовал [вычисленные свойства] для имени, но изменил его в демонстрационных целях.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Поскольку у вас есть доступ к входу в вашей функции onChange, вы можете получить имя входа из event.target и использовать его для внесения изменений в свое состояние.
В качестве альтернативы вы можете привязать функцию:
<CurrencyInput
onChange = {this.handleCurrencyInput.bind(this, currency.name)}
/>
Но это не лучший вариант для рендеринга, поэтому вы можете создать метод renderCurrencyInput в своем классе и привязать его к нему.
Вычисляемые свойства будут работать, я не вижу в этом особой проблемы. Затем вы можете ввести свой первоначальный this.state из своего списка валют.