jeudi 5 août 2021

How can i update my react state with nested objects

I have state for my inputs and request to backend for send mail, when backend send response i want clear my state

const [fields, setField] = useState({
        name: {
            rus_alias: "Имя", // for column name in mail
            value: ''
        },
        email: {
            rus_alias: "Е-маил", // for column email in mail
            value: ''
        },
        question: {
            rus_alias: "Вопрос", // for column question in mail
            value: ''
        },
    });

 axios.post("http://localhost:5000/sendLead", {
            content: {
                ...fields
            },
            theme: 'Вопрос'
        })
            .then(data=>{
                console.log(data);

                for(let key in fields){
                    setField({
                        ...fields, 
                        [key]: {
                            rus_alias: fields[key].rus_alias,
                            value: ''
                        }
                    });
                    

                    console.log(fields);
                }
            });

return(<Input placeholder="Ваш Email" linkAttr="email" setter={inputHandler} value={fields.email.value} />);

Input component:

export function Input({placeholder, setter, linkAttr, value}){
    return (
        <input type="text"
            placeholder={placeholder}
            defaultValue={value}
            onChange={setter}
            data-link={linkAttr}
            className="input text col-12"
        />
    )
}

but, my inputs not clear and state not update. What can i do for resolve this issue




Aucun commentaire:

Enregistrer un commentaire