Here's an example of such PHP array:
["Foo" => 100, "Bar" => 50]
Great. Here's my attempt at passing them onto the Chart component:
<Chart points="{!! json_encode($points) !!}"></Chart>
This looks fine, but the strings (Foo and Bar) inside the $points
array get encapsulated with " (double quotes) when using json_encode()
. This means that whenever the 1st string appears in the array, the browser thinks that the " is meant to close the points
attribute.
Here's what you get to see in the browser:
<Chart points="{">Foo":100,"Bar":50}"</Chart>
How do I go about this? I have been struggling with this for hours now, and I can't wrap my head around it.
<Chart points='{!! json_encode($points) !!}'></Chart>
只需使用单数引号。
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>
可以使用正式方式:
<Chart points='<?php echo json_encode($points); ?>'></Chart>
从Laravel 5.5开始,您可以使用@json指令。
<Chart points=@json($points)></Chart>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.