这是一个奇怪的问题

系统mac
laravel版本5.4
工具phpstorm
开发环境mamp
web.php
Route::get('/', function () {
    $data = ['1', '2', '3'];
    return view('welcome', compact('data'));
});
example.vue
<template>
    <div>
        111
    </div>
</template>

<script>
    export default {
        props:['data'],
        mounted() {
            console.log('Component mounted.', this.data);
        }
    }
</script>

welcome.blade.php
调用example.vue的地方
<!DOCTYPE html>
<html lang="{ config('app.locale') }">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Laravel</title>
    </head>
    <body>
        <div class="flex-center position-ref full-height" id="app">
            <example :data="{$data}"></example>
        </div>
    </body>
</html>

app.js 没改过
require('./bootstrap');

Vue.component('example', require('./components/Example.vue'));

const app = new Vue({
    el: '#app'
});

bootstrap.js 没改过

出现问题
ErrorException in helpers.php line 532:
htmlspecialchars() expects parameter 1 to be string, array given (View: /Users/leijiawei/web/projects/sitecy/resources/views/welcome.blade.php)

我看之前 部分 都是 说 使用 @foreah 但是 这里是直接传递数组 在welcome.blade.php中
{dd($data)}可以打印出数据 但是:data="{$data}"报错 当$data='data'字符串没问题 
我这里的data并不是 在blade中处理而是需要在vue中处理

不奇怪,这个 data 是数组

 :data="{json_encode($data)}"
JellyBool
修改的评论也不能少于六个字哦!