Pass PHP array onto Vue component using props
Although reading previous answers this took me a while to get working. So, here's what works for me with Laravel 5.5 and VueJs 2.5:
Convert your PHP array to a JSON serialized string.
For PHP arrays see json_encode.
For Eloquent collections see the Eloquent method toJson.
For further reference we call this new JSON string$arrayAsJSON
.In your view (or Blade template):
<some-vue-component :componentProperty="{{ $arrayAsJSON }}"></some-vue-component>
The Vue Component:
<template></template><script> export default { props: ['componentProperty'], mounted() { console.log('some-vue-component mounted.'); console.log(this.componentProperty) }, }</script>