Vue Things

notes.md

Another way we can approach passing data down into Vue, is instead of passing in an object like

<SomeComponent :contact="contact"/>

and in SomeComponent needing to do

{{contact.firstName}}

You can use a v-bind short cut like:

<SomeComponent v-bind="contact"/>

And change the props of SomeComponent to be:

<div>
{{firstName}}
</div>

export default {
 name: 'SomeComponent',
 props: ['firstName','lastName'] // short hand - should make use of the type / required / etc
}

In the component that is calling SomeComponent -- if the contact object is there, and has keys that match firstName and lastName - they will get passed down as props, and in SomeComponent can do

I cover this in more detail in a talk I gave recently, slides here