请我尝试将数组对象动态设置为输入字段并将其发送到后端。谢谢
当我 console.log 打印输出时,它返回未定义。大家好,请我尝试将数组对象动态设置为输入字段并将其发送到后端。谢谢
大家好,请我尝试将数组对象动态设置为输入字段并将其发送到后端。谢谢
const myArr= [
{product: 'egg', price: 5, id:1},
{product: 'cake', price: 3, id:2}
]
const [input, setInput] = useState(myArr)
const changeHandler = (id) => event => {
const { name, value } = event.target;
setInput(input => input.map((el) => el.id === id
? {
...el,
[name]: value,
}
: el,
));
};
const submitForm = (e) =>{
e.preventDefault();
let printOut = input
console.log({print:printOut});
try {
axios.post('/products/print', printOut)
} catch (error) {
console.log(error);
}
}
return (
<form onSubmit={submitForm}>
{myArr.map(x=>(
<div key={x.id}>
<input name='product' value= {x.product} onChange={(e) =>changeHandler(x.id)(e)} />
<input name='price' value= {x.price} onChange={(e)=> changeHandler(x.id)(e)} />
</div>
))}
<input type="submit" value="Submit" />
</form>
)