How to transcribe Vue associative array into HTML form input values

Question

I have an HTML form, which used to have input values based on a Vue array like so:

// Vue Var
var postIDarr = [postID, postID, etc., etc.];
// HTML
<input v-for="(id, index) in postIDarr" type="hidden" name="postIDArr[]" :key="index" :value="id">

This worked fine for a while, but now I want to make the array an associative array, encoding both the postID and the userID for processing on the backend. The array in Vue has the structure as follows;

var postIDarr = {
    userID: postID,
};
// These are placeholders obviously

How would I be able to encode both of these values into the HTML form?

Wasn't entirely sure how to write this question without being repetitive, if you need any more information please let me know.

The documentation for v-for over objects is here: vuejs.org/v2/guide/list.html#v-for-with-an-Object — Jesse Reza Khorasanee
– Jesse Reza Khorasanee, Commented Sep 2, 2020 at 22:34
Does this answer your question? Access index in v-for when iterating over object — Jesse Reza Khorasanee
– Jesse Reza Khorasanee, Commented Sep 2, 2020 at 22:35

Boussadjra Brahim · Accepted Answer · 2020-09-02 22:33:01Z

1

if you have an object like :

var postIDarr = {
    userID: postID,
}

and you want want render it using v-for by showing the key and value, so you could do it like :

 v-for="(id,key, index) in postIDarr"

id refers to postID

key refers to userID

answered Sep 2, 2020 at 22:33

Boussadjra Brahim

90k19 gold badges163 silver badges183 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Nathan Over a year ago

and how would I attach both of these values into an array input?

Boussadjra Brahim Over a year ago

what do you mean by attach?

Collectives™ on Stack Overflow

How to transcribe Vue associative array into HTML form input values

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related