Laravel 前后台共享数据

简介: 在视图模板中初始化JS变量。 var app = ;5.5以后可以这么写, 用 @json Blade 指令替代手动 json_encode var app = @json($array);曾经在多语言项目中这么用过。
在视图模板中初始化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

相关文章
|
5月前
|
JavaScript 前端开发 API
面试官:ui组件可以自动加载,那么业务组件可以吗?
面试官:ui组件可以自动加载,那么业务组件可以吗?
|
5月前
|
前端开发 API 开发者
Javaweb之前后台分离开发介绍的详细解析
2.1 前后台分离开发介绍 在之前的课程中,我们介绍过,前端开发有2种方式:前后台混合开发和前后台分离开发。 前后台混合开发,顾名思义就是前台后台代码混在一起开发,如下图所示:
89 0
|
6天前
|
JavaScript 前端开发
前端js,vue系统使用iframe嵌入第三方系统的父子系统的通信
前端js,vue系统使用iframe嵌入第三方系统的父子系统的通信
|
2月前
|
存储 前端开发 JavaScript
|
2月前
|
前端开发
|
2月前
|
存储 缓存 数据库
Django后端架构开发:信号与缓存架构开发
Django后端架构开发:信号与缓存架构开发
70 0
|
2月前
|
JSON API 网络架构
Django 后端架构开发:DRF 高可用API设计与核心源码剖析
Django 后端架构开发:DRF 高可用API设计与核心源码剖析
56 0
|
11月前
|
XML 存储 JSON
web前后台数据交互的四种方式
web前后台数据交互的四种方式
|
5月前
|
存储 小程序 JavaScript
【微信小程序】-- 全局数据共享 - MobX(四十三)
【微信小程序】-- 全局数据共享 - MobX(四十三)
|
前端开发 JavaScript PHP
Yii2的小部件是什么?底层原理是什么?
Yii2的小部件是什么?底层原理是什么?