25.06.2018 Views

Full-Stack Vue.js 2 and Laravel 5

Create successful ePaper yourself

Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.

Props<br />

We can send data to a component through a custom HTML property know as a<br />

prop. We must also register this custom property in an array, props, in the<br />

component's configuration. In the following example, we've created a prop, title:<br />

My component! --> <br />

<strong>Vue</strong>.component('my-component', { template: '{{ title }}', props:<br />

['title'] });<br />

new <strong>Vue</strong>({ el: '#app' }); <br />

A prop can be used just like any data property of the component: you can<br />

interpolate it in the template, use it in methods <strong>and</strong> computed properties, <strong>and</strong> so<br />

on. However, you should not mutate prop data. Think of prop data as being<br />

borrowed from another component or instance - only the owner should change it.<br />

Props are proxied to the instance just like data properties, meaning<br />

you can refer to a prop as this.myprop within that component's code.<br />

Be sure to name your props uniquely to your data properties to<br />

avoid a clash!

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!