Laravel前後臺共享資料

飛凡的陀螺發表於2018-10-03
在檢視模板中初始化JS變數。
<script>
    var app = <?php echo json_encode($array); ?>;
</script>

5.5以後可以這麼寫, 用 @json Blade 指令替代手動 json_encode

<script>
    var app = @json($array);
</script>

曾經在多語言專案中這麼用過。

<script>
    window.Laravel = {
        csrfToken: `{{ csrf_token() }}`,
        Locale: `<?php echo App::getLocale(); ?>`,
        Languages: <?php echo json_encode(
            [
                `scaffold`         => __(`scaffold::t`),
                `module_dashboard` => __(`module_dashboard::t`),
                `module_user` => __(`module_user::t`),
                `setting` => __(`setting::t`),
            ],
            JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE);?>
    };
</script>
Laravel變數傳入在vue元件中

定義元件

<script>
export default {
    props: [`surveyData`],
    mounted () {
        // Do something useful with the data in the template
        console.dir(this.surveyData)
    }
}
</script>

注入變數

<survey-component :survey-data="`{!! json_encode($surveyData) !!}`"></survey-component>

參考:
https://medium.com/@m_ramsden/passing-data-from-laravel-to-vue-98b9d2a4bd23
https://laravel-china.org/docs/laravel/5.6/blade/1375


相關文章