Vue: How to pass multiple Props with a loop

Question

I have an Object with multiple properties.

And i want to pass this multiple Props in my component. Usually i know which props i want to pass and do it like this:

<component :prop1="object.prop1" :prop2="object.prop2" :prop3="object.prop3" />

But i want to pass the props without knowing how much props there are in my JSON Object. Like a loop:

<component :loopThroughMyProps="object" />

So that i get the same result. Is there any possibility to achieve this?

m.cichacz · Accepted Answer · 2018-09-24 15:42:02Z

2

I think all you need is

<component v-bind="object"/>

Then in component you will have props named as per object keys.

answered Sep 24, 2018 at 15:42

m.cichacz

7591 gold badge9 silver badges22 bronze badges

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

2 Comments

CodeConnoisseur Over a year ago

can you elaborate on this? Then in component you will have props named as per object keys.

m.cichacz Over a year ago

@PA-GW well, if you have object like this: {a: b} and pass it to the v-bind you will be able to access it inside component by calling this.a. No more code needed AFAIK.

Collectives™ on Stack Overflow

Vue: How to pass multiple Props with a loop

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related