DEV Community

How to make a form handling with vuex

Matheus Gomes 👨‍💻 on December 30, 2019

Problem Let's say you want to save the input of your form on the state of vuex. Maybe someone new to vuex would try something like this...
Collapse
 
vamsigandra profile image
Vamsi

Thanks! This is exactly what I am looking for.
Where do you call the mapFields function. Could you please show an example?

Collapse
 
lilarmstrong profile image
Armstrong

I think if you do something like

...

Then, in your methods you define the 'handleSubmi function as follows:

methods:{
handleSubmit(e){
e.preventDefault();
mapFields(e)
//...
}

I think something like the above would do... what do you think?

Collapse
 
matheusgomes062 profile image
Matheus Gomes 👨‍💻

I would use it in the computed property, so i could change the state as i input .

Collapse
 
matheusgomes062 profile image
Matheus Gomes 👨‍💻

My fault, I will edit the post to answer you, sorry for this and thanks for asking.

Collapse
 
mordechairoth profile image
mordechairoth

Thank you! for this amazing super cool solution. I was searching the web for a normal not redundant way to deal with forms when using Vuex and thank god I bumped into this post. This is an amazing and easy solution, thanks.

p.s. there's a syntax error in the example 'const fields = [options.fields[x]]', the outer square brackets should be removed.

Collapse
 
wakeupmh profile image
Marcos Henrique

Awesome post, congrats gomito 🤘

Collapse
 
themsiqueira profile image
Siqueira

Congratulation, it’s a great article!

Collapse
 
matheusgomes062 profile image
Matheus Gomes 👨‍💻

Thanks man!

Collapse
 
lilarmstrong profile image
Armstrong

Lovely... lovely article. Thanks

Collapse
 
unaimian profile image
U.N • Edited

Thanks for this elegant solution. But what about nested fields in base? It doesn't seem to be working for nested objects

Collapse
 
assoft profile image
Assoft

This is awesome. Thank you.

Collapse
 
dcruz1990 profile image
Dennis Quesada Cruz

WoW! Awesome! i was looking for some like that!!

Collapse
 
sergiosuramin profile image
sergiosuramin

can you show us your store?