Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

pass in vue data into a component but I have other props too

I have data in App.vue that looks like this:

data() {
    return {
        information: {
          item1: 'item 1 string',
          item2: 'item 2 string', 
          item3: 'item 3 string'
        } 
    }
},

I want to pass this info into a component like this:

<ComponentName prop="something-else" info=this.data.information.item1 />

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

But I don’t get the data, I just get the string..?

Passing data to components in vue.js

SO I go:

<ComponentName prop="something-else" :info=this.data.information.item1>

But my whole page goes blank

Vue JS 3: How to pass data from one component to another other?

I’m a little bit confused by this one but then I found

Passing the data into component in vuejs

So I added basically like, a static method

<ComponentName prop="something-else" information=information.item1>

methods: {
    information() {
      this.information.item1 = information.item1
    }
},

But I get an error about duplicated key and a no-undef error.

How do you pass data from vue into a component?

>Solution :

You should access directly the data returned from the data option and bind it to the prop :

<ComponentName :info="information.item1">
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading