CODEWITHSUNDEEP
vue.js
user1093111
user1093111

Reputation: 1111

How to add multiple input values to store in Vue

Trying to add to a store on click from an input. There would be multiple inputs with different parts of an objects info. How can I grab in input data from a method?

In this case, I'm working with packets via a store

<input label="Packet Name" v-model="packets.name"  required><br>
<input label="Packet Name" v-model="packets.folder"  required><br>
<button @click="addPacket">Add</button>

On the addPacket call how do I get the input data?

Full jsfiddle : https://jsfiddle.net/tga9sfcm/1/

Upvotes: 0

Views: 1221

Answers (1)

Void Ray
Void Ray

Reputation: 10219

  • I added two data props to the app: name and folder.
  • Changed v-model binding to this two props.
  • Dispatched an action on button click.

Here is a working fiddle

Also, note that you dispatch Actions and commit Mutations. You had your action dispatching a mutation: store.dispatch('ADD_PACKET', packet)

Upvotes: 1

Related Questions