如何将值从 Laravel 的控制器发送到 Vue.js？

Question

我有控制器“SomethingController”、模型“ValueModel”和视图“Show.blade.php”以及带有组件“vue-component”的 vue

现在我想获取发送值（我从模型“ValueModel”中获得，该值在 JSON 中）格式）从SomethingController到Show.balde.php，其中将包含 vue "vue-component"。最后，我想从控制器获取 vue 中的值。

我知道如何从控制器发送一个值来查看。当值在字符串中时，我已使用props将其发送到 vue 。但是我无法将 JSON 值从 prop 发送到 vue。

控制器

//SomethingController.php

class SomethingControllerextends Controller

{

    public function index()

    {

        $e = ValueModel::get();

        $e = json_encode($e->toArray());

        return view('pages.Show')->with('e', $e);

    }

}

看法

//Show.blade.php

<div class="app">

    <vue-component data={!!$e!!}></vue-component>

</div>

视图

//SomethingController.php

<script>

export default {

    props: ['data'],

    data(){

        return{

            d : this.data,

        }

    },

    beforeCreate(){

        console.log('helllo');

        console.log(d)

        },

}

</script>

令我惊讶的是，我正在窗口上打印数据。在窗口上打印值后，函数 beforeCreate() 中的操作不起作用。

如图所示，数据正在从控制器发送的窗口上打印，因为我想要 vue 中的数据。我也想知道为什么要打印它。

对于从控制器返回的字符串，一切正常

Answer 1

我得到了答案，这里必须使用单引号。&nbsp;data = '{!!$e!!}'这是因为里面的数据$e有双引号。例如：[{"country":"Alwaysland","zip":"0023"},{"country":"Neverland","zip":"00111"}]