вывод input в react в цикле
Господа, прошу совет ( сильно упростил код, что бы не погружать во все нюансы )
Есть компонент, рисует форму, работает как надо. Особенность - вывод input в цикле, т.к. из очень много. Вот оч не охота для каждого поля прописывать отдельно IF + const. Если взять код ниже - получается, что при вводе в input, значение попадает в нужную переменную, и отображается на экране
Можно ли как то добавить в данную конструкцию возможность что бы при загрузке страницы, брались параметры из GET и при этом при изменении в INPUT можно было менять значение без смены курсора и доп. перезагрузок? ( вывод полей в цикле хочу сохранить )
// компонент
function Cabinet(props) {
// устанавливаем значение в объект, так, что бы не было перезагрузки страницы, и что бы после этого курсор оставался в поле где вводили что либо ( )
function setFuncFormValues(name, value){
let tempForm = formValues
tempForm[name] = value
setFormValues(tempForm)
//console.log(tempForm) - все как надо
}
// получаю это из вне, и полей реально много
let fields = [
{name: "id"},
{name: "name"},
..
{name: "email"},
]
// если заранее записать в объект значения, то onChange не работает
const [formValues, setFormValues] = useState({})
// вывод полей в цикле
const FormFilters = () => {
fields.map((item, key) => {
return <input
key={key}
value={formValues[item.name]}
onChange={e => setFuncFormValues(item.name, e.target.value)}
/>
})
}
return <div><FormFilters /></div>
}